jQuery的嵌套UL下拉菜单

我想要的链接被点击并在第二次点击再向上滑动时，嵌套的菜单滑下。这是行得通的。

我还需要任何其他打开的嵌套菜单关闭，当另一个链接被点击。这不起作用。

我试图在打开嵌套菜单之前关闭任何打开的嵌套菜单我想要但是当嵌套菜单中的链接被点击时，这也会关闭嵌套菜单。

$(document).ready(function() { 
    $('#nav ul.children').slideUp(); 
    $('#nav li').click(function (e) { 
     $('ul.children').slideUp(); 
     $('ul', this).slideToggle(); 
     e.stopPropagation(); 
    }); 
});

http://www.ttmt.org.uk/forum/nav/index2.html

我怎样才能的slideToggle嵌套菜单时，它的父被点击并关闭所有打开嵌套的菜单中点击另一个链接时。

<ul id="nav"> 
    <li><a href="#">One</a> 
    <ul class="children"> 
     <li><a href="http://www.google.com">One/One</a></li> 
     <li><a href="http://www.bbc.com">One/Two</a></li> 
     <li><a href="#">One/Three</a></li> 
    </ul> 
    </li> 
    <li><a href="#">Two</a></li> 
    <li><a href="#">Three</a> 
    <ul class="children"> 
     <li><a href="#">Three/One</a></li> 
     <li><a href="#">Three/Two</a></li> 
    </ul> 
    </li> 
</ul>

$(document).ready(function(){ 
    $('#nav ul.children').slideUp(); 
    $('#nav li').click(function(e){ 
    //$('ul.children').slideUp(); 
    $('ul', this).slideToggle(); 
    e.stopPropagation(); 
    }); 
});

编辑

我有我的代码中的另一个主要问题，因为我关闭嵌套UL在开始与

$('#nav ul.children').slideUp();

单击链接并重新加载页面时，所有菜单都关闭。如何在页面重新加载时保持嵌套菜单打开。

来源

2012-04-25 ttmt

您的链接都死了，这不是很有用。 – Johannes 2013-09-23 15:08:46

为了防止子项被点击时的动作，使用此：

$('#nav > li').click(function(e){ ...

的“>”字符选择的李是一个孩子相反，任何后代

...所以当点击次级链接中的链接时不会发生$('ul.children').slideUp();。

来源

2012-04-25 09:33:01 Faust

首先是隐藏使用在页面加载CSS样式隐藏所有嵌套UL标签来解决你的第二个问题（页面加载）

li ul 
{ 
    display:none; 
}

把这个脚本

$("#nav li").click(function(){ 
    $(this).parent().find("li ul:visible").slideUp(); //this helps to slideUp visible uls 
    //then your code 
});

来源

2012-04-25 10:12:54 Dharmesh

jQuery的嵌套UL下拉菜单

回答

相关问题