多下拉菜单显示不正确

我正在处理多级下拉菜单。它看起来像下拉菜单中的下拉菜单。当我单击内部下拉菜单时，它不显示右侧，它打开下面的menu.I要显示内部下拉菜单右边像楼梯案例。如何解决这个问题？多下拉菜单显示不正确

这里

<li class="dropdown"> 
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">E-magazine 
     <b class="caret"></b> 
    </a> 
    <ul class="dropdown-menu"> 
     <li class="dropdown-submenu"> 
     <li><a href="../Home/Emag">Valarum Vinnarasu</a></li> 
     <li><a href="#">The Throne</a></li> 
     </li> 
    </ul> 
</li> 
<li><a href="../Home/childrenhome">Children Home</a></li> 
</ul> 
</li>

来源

2015-06-22 Jos Sat

使用所有实际代码发布工作演示。 –

你在你的代码也许它帮助标签错误我的代码。显示你的CSS，看你如何实现下拉菜单

<ul> 
    <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">E-magazine<b class="caret"></b></a> 
    <ul class="dropdown-menu"> 
     <li class="dropdown-submenu"> 
     <ul> 
      <li><a href="../Home/Emag">Valarum Vinnarasu</a></li> 
      <li><a href="#">The Throne</a></li> 
     </ul> 
     </li> 
    </ul> 
    </li> 
    <li><a href="../Home/childrenhome">Children Home</a></li> 
</ul>

来源

2015-06-22 10:35:10

你可以用JavaScript来做到这一点。 JavaScript代码

例子：

function showNested(caller) { 
    var elem = caller; 
    var child = $(":first-child", elem); 
    if (child.is(":visible")) 
     child.hide(); 
    else 
     child.show(); 
}

和HTML：

<ul> 
    <li>List item one</li> 
    <li><a href="#" id="elemId1" onclick="showNested(this);">List item two with subitems: 
     <ul id="innerList" style="display: none"> 
     <li>Subitem 1</li> 
     <li>Subitem 2</li> 
     </ul> 
    </a></li> 
    <li>Final list item</li> 
</ul>

工作原理：它反应onclick事件。当你单击元素时，showNested函数运行并将调用者作为参数传递。它找到调用者的第一个子元素（内部列表）并显示它。当你再次点击时，它会隐藏它。您可以将该功能用于少数嵌套列表。您可以使用onmouseover事件。

来源

2015-06-22 11:03:27

多下拉菜单显示不正确

回答

相关问题