我已经尝试了许多这类问题的示例,但仍然找不到如何在引导程序下拉列表的标题上显示所选项目以及如何通过javascript获取所选项目的方法。如果有人知道该代码,请帮助我提供我应该放在头部的链接。因为我认为可能是我的头部缺少了一些内容。
这是示例下拉列表。
<div class="btn-group">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
Option: <span class="selection">Option 1</span><span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Option 1</a></li>
<li><a href="#">Option 2</a></li>
<li><a href="#">Option 3</a></li>
</ul>
</div>
最佳答案
我对HTML进行了一点修改,并添加了jquery
事件:
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
Dropdown: <span class="selected"></span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Separated link</a></li>
</ul>
</div>
jQuery:
$('div.dropdown ul.dropdown-menu li a').click(function (e) {
$('.selected').html($(this).html());
})
--DEMO--