Html Bootstrap Dropdown 获取所选项目的值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17127572/
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
Bootstrap Dropdown get value of selected item
提问by felix001
With the Bootstrap dropdown-toggle buttons is there any way to show the value that has just been selected?
使用 Bootstrap 下拉切换按钮有什么方法可以显示刚刚选择的值吗？
<form action="/output/" name="InputCacheCheck" method="post">
{% csrf_token %}
<div class="input-prepend input-append">
<div class="btn-group">
<button class="btn dropdown-toggle" name="recordinput" data-toggle="dropdown">
Record
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="#">A</a></li>
<li><a href="#">CNAME</a></li>
<li><a href="#">MX</a></li>
<li><a href="#">PTR</a></li>
</ul>
<input class=".input-large" name="hostnameinput" id="appendedInputButton" type="text">
<button class="btn" type="submit">Lookup</button>
</div>
</div>
</form>
Also the name recordinput isn't being supplied within the forms POST data. Any ideas?
此外，表单 POST 数据中未提供名称 recordinput。有任何想法吗？
回答by Zim
You should be able to change the dropdown text like this..
您应该能够像这样更改下拉文本。
$(".dropdown-menu li a").click(function(){
var selText = $(this).text();
$(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="caret"></span>');
});
Demo http://www.bootply.com/64302
演示http://www.bootply.com/64302
How is the form being 'POST'ed?
表单是如何“发布”的？
回答by snowYetis
Or you can do it likes this...
或者你可以这样做......
Using (documemt).on seems to work more consistently than targeting the click event from the element class. Also, by giving the button element an ID helps with assigning your dropdown selection in this case.
使用 (documemt).on 似乎比从元素类定位点击事件更一致。此外，在这种情况下，通过为按钮元素提供 ID 有助于分配下拉选择。
$(document).on('click', '.dropdown-menu li a', function () {
var selText = $(this).text();
$('#dLabel').html(selText + '<span class="caret"</span>');
});
<div class="dropdown">
<button type="button" class="btn btn-primary dropdown-toggle" id="dLabel" role="button" data-toggle="dropdown" data-target="#">
Lists
<span class="caret"></span>
</button>
<ul id="drpdn_List" runat="server" class="dropdown-menu" role="menu" aria-labelledby="dropdownmenu">
</ul>
</div>
回答by Srinivas
In this case you should not use Bootstrap dropdown toggle. This is useful to show one or more hyperlinks when user click / hover on a button.
在这种情况下，您不应使用 Bootstrap 下拉切换。当用户单击/悬停在按钮上时，这对于显示一个或多个超链接很有用。
if you want style dropdown, you can use some other plugins like selectfxwhich acts/returns value like a dropdown.
