javascript - 动态添加的子菜单不会切换 - 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

由于item是动态生成的，所以需要通过静态parent来选择它，让它响应点击事件

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