twitter-bootstrap 在引导程序中选择项目时如何更改下拉列表的主显示
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14066631/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to change the main display of dropdown when an item is selected in bootstrap
提问by Coder_sLaY
This is the following http://jsfiddle.net/coderslay/enzDx/
这是以下http://jsfiddle.net/coderslay/enzDx/
I am trying to change the text Selectas soon as an item is clicked
我正在尝试在单击项目后立即更改文本选择
So if i select Onefrom the list then Oneshould be displayed.
所以如果我One从列表中选择，那么One应该显示。
How to do it?
怎么做？
回答by Elliot B.
Working example: http://jsfiddle.net/enzDx/5/
工作示例：http: //jsfiddle.net/enzDx/5/
The only change I made to your HTML was to wrap the text "Select" with spantags with the element ID dropdown_titleso it was easier to update.
我对您的 HTML 所做的唯一更改是用span带有元素 ID 的标签包装文本“选择”，dropdown_title以便更容易更新。
JavaScript:
JavaScript：
$('.dropdown-toggle').dropdown();
$('#divNewNotifications li').on('click', function() {
$('#dropdown_title').html($(this).find('a').html());
});?
Basically all I'm doing is whenever the user clicks on a list item, I update the drop-down title text with the text of the link contained in the last item.
基本上我所做的就是每当用户单击列表项时，我都会使用最后一项中包含的链接文本更新下拉标题文本。
回答by Samuel Caillerie
You can check the clickevent on the dropdown-menu:
您可以在以下位置查看click事件dropdown-menu：
$('.dropdown-menu > li').click(function() {
var $toggle = $(this).parent().siblings('.dropdown-toggle');
$toggle.html("<i class=\"icon icon-envelope icon-white\"></i> " + $(this).text() + "<span class=\"caret\"></span>")
});
jsFiddle : http://jsfiddle.net/enzDx/6/.
jsFiddle：http: //jsfiddle.net/enzDx/6/。
回答by mornaner
HTML:
HTML：
<ul class="nav nav-pills left">
<li class="dropdown active span8">
<a class="dropdown-toggle" id="inp_impact" data-toggle="dropdown">
<i class="icon icon-envelope icon-white"></i>
<span id="text">Select</span><span class="caret"></span>
</a>
<ul ID="divNewNotifications" class="dropdown-menu">
<li><a>One</a></li>
<li><a>Two</a></li>
<li><a>Three</a></li>
</ul>
</li>
</ul>
JavaScript:
JavaScript：
$('.dropdown-toggle').dropdown();
$('#divNewNotifications li > a').click(function(){
$('#text').text($(this).html());
});
I have just added a span around the Selecttext in html to do the Javascript code simpler.
我刚刚Select在 html 中的文本周围添加了一个跨度，以简化 Javascript 代码。
