javascript - 如何在 Bootstrap 下拉列表的标题中显示所选项目？以及如何在 javascript 警报框中显示所选项目？

Question

我已经尝试了此类问题中给出的很多示例，但仍然找不到如何在 Bootstrap 下拉列表的标题上显示所选项目以及如何通过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>

Answer 1

我修改了一点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--