动态添加的子菜单不会切换 - Bootstrap

Question

好的，我现在非常绝望。我已经为原始的Bootstrap下拉菜单创建了一个子菜单：

  <ul class="nav navbar-nav">
    <li class="dropdown">
      <a href="#" class="dropdown-toggle" data-toggle="dropdown">
        Dropdown
      </a>
      <ul class="dropdown-menu">
        <li class="dropdown-submenu">
          <a href="#">Open submenu ></a>
          <ul class="dropdown-menu">
            <li>
              <a href="#">Submenu link</a>
            </li>
          </ul>
        </li> <!-- / .dropdown-submenu -->
      </ul>
    </li> <!-- / .dropdown -->
  </ul> <!-- / .navbar-nav -->

http://codepen.io/Deka87/pen/ORyRLd

按预期工作直到我尝试动态添加其他子菜单。请尝试在示例Codepen中单击“添加其他菜单”。这将添加一个菜单，但您将无法切换它。相反，它只会关闭当前的父菜单，而这就是它。

任何想法都将受到高度赞赏！

Answer 1

由于该项是动态生成的，您需要通过静态父项选择它才能响应click事件

$(".navbar").on("click", ".dropdown-submenu > a", function(){
....
....
});