Bootstrap3 .form-control很酷，但对于那些喜欢或需要带有按钮和ul选项的下拉菜单的人来说，这里是更新的代码。我已经编辑了Steve的代码，以修复跳转到哈希链接并在选择后关闭下拉菜单。

感谢史蒂夫、本和斯凯利!

$(".dropdown-menu li a").click(function () {
    var selText = $(this).text();
    $(this).closest('div').find('button[data-toggle="dropdown"]').html(selText + ' <span class="caret"></span>');
    $(this).closest('.dropdown').removeClass("open");
    return false;
});

随着Bootstap中下拉语法的变化，Skelly的漂亮而简单的答案现在已经过时了。你可以这样说:

$(".dropdown-menu li a").click(function(){
  var selText = $(this).text();
  $(this).parents('.form-group').find('button[data-toggle="dropdown"]').html(selText+' <span class="caret"></span>');
});

你可以使用下拉组件进行引导选择…

引导5(更新2021年)

<a class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown" href="#" id="selectA">Select<span class="caret"></span></a>
<ul class="dropdown-menu">
     <li class="dropdown-item"><a href="#">Item I</a></li>
     <li class="dropdown-item"><a href="#">Item II</a></li>
     <li class="dropdown-item"><a href="#">Item III</a></li>
     <li class="dropdown-item"><a href="#">Item IV</a></li>
</ul>


let links = document.querySelectorAll('.dropdown-item')
links.forEach(element => element.addEventListener("click", function () {
    let text = element.innerText
    document.getElementById('selectA').innerText = text
}))

引导5

原始答案(引导3)

另一个选择是使用jQuery使Bootstrap下拉菜单的行为像一个选择…

$(".dropdown-menu li a").click(function(){
  var selText = $(this).text();
  $(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="caret"></span>');
});

引导3

Bootstrap3 .form-control很酷，但对于那些喜欢或需要带有按钮和ul选项的下拉菜单的人来说，这里是更新的代码。我已经编辑了Steve的代码，以修复跳转到哈希链接并在选择后关闭下拉菜单。

感谢史蒂夫、本和斯凯利!

$(".dropdown-menu li a").click(function () {
    var selText = $(this).text();
    $(this).closest('div').find('button[data-toggle="dropdown"]').html(selText + ' <span class="caret"></span>');
    $(this).closest('.dropdown').removeClass("open");
    return false;
});

本的代码要求父div有form-group类(我使用btn-group)，这是一个略有不同的版本，只是搜索最近的div，甚至可能更快一点。

$(".dropdown-menu li a").click(function(){
    var selText = $(this).text();
    $(this).closest('div').find('button[data-toggle="dropdown"]').html(selText + ' <span class="caret"></span>');
});

Bootstrap 3使用.form-control类来设置表单组件的样式。

<select class="form-control">
    <option value="one">One</option>
    <option value="two">Two</option>
    <option value="three">Three</option>
    <option value="four">Four</option>
    <option value="five">Five</option>
</select>

http://getbootstrap.com/css/#forms-controls