Html 另一个下拉菜单内的下拉菜单不工作

我很难在另一个下拉菜单中找到一个下拉菜单来工作。第一级下拉菜单工作正常，但对于第二级，当我点击下拉菜单（学习档案）的选项时，什么都没有发生。。。菜单无法显示

菜单

html中几乎没有变化

<div class="container">
    <div class="row">
        <div class="col-md-2">
            <nav id="sideNavBar">
                <ul class="nav nav-pills nav-stacked">
                    <li id="navBarTitle">MENU</li>

                    <li class="dropdown">
                        <a href="Children.html" data-toggle="dropdown" class="droptown-toggle">Children <span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li>
                                <a href="ChildrenAddChild.html">Add Child</a>
                            </li>
                            <li>
                                <a href="ChildrenAddChild.html">Archive/Delete Child</a>
                            </li>
                            <li>
                                <a href="ChildrenDetails.html">Children Details</a>
                            </li>
                            <li class ="dropdown-submenu">
                                <a href="#" class="test droptown-toggle" data-toggle="dropdown">Learning Profiles<span class="caret"></span></a>
                                  <ul class="dropdown-menu">
                                      <li>
                                          <a href="Observations.html">Observations</a>
                                      </li>
                                      <li>
                                          <a href="learningOutcomes.html">Learning Outcomes</a>
                                      </li>
                                      <li>
                                          <a href="Photos.html">Photos</a>
                                      </li>
                                  </ul>
                               </a>
                            </li>
                        </ul>
                    </li>
                </ul>
           </nav>
       </div>
  </div>

您还需要添加javascript

$(document).ready(function(){
 $('.dropdown-submenu a.test').on("click", function(e){
 $(this).next('ul').toggle();
 e.stopPropagation();
 e.preventDefault();
 });
});

---

正在工作的plunker:

我找到了这个链接，它可能会对您有所帮助：因为引导文档没有提到不支持嵌套下拉列表，所以我假设它们是。但你可能是对的，也许他们不受支持。你发给我的链接正好显示了我想要实现的目标。我去看看。谢谢。另一个很好的链接-

$(document).ready(function(){
 $('.dropdown-submenu a.test').on("click", function(e){
 $(this).next('ul').toggle();
 e.stopPropagation();
 e.preventDefault();
 });
});