引導程序3下拉菜單不起作用

Question

即使在懸停之前，子菜單程序塊也始終可見。無法瞭解什麼是丟失： -

**HTML** 

<li class="dropdown"> 
      <a class="dropdown-toggle" data-toggle="dropdown" data-target="#" href="#"> 
      Menu 
      </a> 
      <ul class="dropdown-menu"> 
      <li><a href="#">Item1</a></li> 
      <li class="dropdown-submenu"> 
       <a href="#">Item2</a> 
       <ul class="dropdown-menu" > 
        <li> 
         <a href="#">Item2.1</a> 
        </li> 
        <li> 
         <a href="#">Item2.2</a> 
        </li> 
       </ul> 
      </li> 
      </ul> 
     </li> 

CSS

/* dropdown sub menu support for Bootsrap 3 */ 
.dropdown-submenu { 
    position: relative; 
} 

.dropdown-submenu > .dropdown-menu { 
    top: 5px; 
    left: 100%; 
    margin-top: -6px; 
    margin-left: -1px; 
} 

.dropdown-submenu:hover > .dropdown-menu { 
    display: block; 
} 

當我將鼠標懸停下拉菜單的主菜單的子菜單塊始終可見？

.dropup .dropdown-submenu > .dropdown-menu { 
    top: auto; 
    bottom: 0; 
    margin-top: 0; 
    margin-bottom: -2px; 
} 

.dropdown-submenu > a:after { 
    position: absolute; 
    display: inline-block; 
    font-size: 14px; 
    right: 7px; 
    top: 7px; 
    font-family: FontAwesome; 
    height: auto; 
    content: "\f105"; 
    font-weight: 300; 
} 

.dropdown-submenu:hover > a:after { 
    border-left-color: #ffffff; 
} 

.dropdown-submenu.pull-left { 
    float: none; 
} 

.dropdown-submenu.pull-left > .dropdown-menu { 
    left: -100%; 
    margin-left: 10px; 
} 

我正在使用metronic主題，並且包含了所有可能的樣式表。

Answer 1

顯然Bootstrap 3.0和更新don't support nested dropdown menus。

也許值得在上面的鏈接中檢查腳本。

我會在這裏它的完整性：

$('ul.dropdown-menu [data-toggle=dropdown]').on('click', function(event) { 
    // Avoid following the href location when clicking 
    event.preventDefault(); 
    // Avoid having the menu to close when clicking 
    event.stopPropagation(); 
    // Re-add .open to parent sub-menu item 
    $(this).parent().addClass('open'); 
    $(this).parent().find("ul").parent().find("li.dropdown").addClass('open'); 
});