css - 如何使用 Select 保持 Bootstrap 下拉菜单打开

Question

我有一个带有选择框的 Bootstrap 下拉菜单，其中有一些我想要的选项。它看起来很好，直到我点击它，下拉菜单关闭。如果单击选择框，如何使下拉菜单保持打开状态？

Here's a bootply.

Answer 1

添加onclick="event.stopPropagation();"给你的<select>

<div class="btn-group">
  <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
    Menu
    <span class="caret"></span>
  </a>
  <ul class="dropdown-menu">
    <li><a href="#">Choice1</a></li>
    <li><a href="#">Choice2</a></li>
    <li><a href="#">Choice3</a></li>
    <li class="divider"></li>
    <select onclick="event.stopPropagation();">
      <option value="volvo">Volvo</option>
      <option value="saab">Saab</option>
      <option value="opel">Opel</option>
      <option value="audi">Audi</option>
    </select>
  </ul>
</div>