Html 下拉列表有问题的引导下拉菜单？

我有一个菜单，它工作得很好，当我聚焦时，菜单会按预期自动关闭

我需要在菜单中添加一个下拉菜单，这样我可以分别进行选择，但奇怪的是，当我尝试在下拉菜单中选择某个内容时，菜单会自动关闭

Html:

<nav class="navbar navbar-inverse">
  <div class="container-fluid">
    <div class="navbar-header">
    </div>
    <div>
      <ul class="nav navbar-nav">
        <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Page 1 <span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a href="#">Page 1-1</a></li>
            <li><ul class="dropdown"><li><select><option>cool</option><option>cooler</option><option>coolest</option></select></li></ul></li>
            <li><a href="#">Page 1-3</a></li>
          </ul>
        </li>
      </ul>
    </div>
  </div>
</nav>

coollCoolercoolest

显示问题的示例

PS:事实上，这是我当地的一个IE问题，它在chrome中工作良好，在fiddle中很难工作，在任何地方都不起作用

---

当我选择菜单中的某个内容时，我不希望菜单失去焦点。

问题是，当您在下拉菜单中单击时，下拉菜单也会关闭。你应该添加（或者删除？）一些JS（或者jQuery，如果你喜欢的话），这样可以避免在你点击下拉菜单时关闭下拉菜单。嗯，如果你按住第1页下拉菜单中的下拉菜单，你可以选择选项，我将对此进行更多研究…@rvervourt我们可以使用

stopPropagation

，但它将在fiddle/my local中的chrome中工作，但在IE 11中也是一个未解决的问题。