jQuery - 仅显示当前 ul

Question

我是 jQuery 新手，对以下导航有一点小问题：

http://jsfiddle.net/6Dh8j/7/

基本上，我喜欢这个可爱网站的创意制作部分的导航：http://www.gainsburyandwhiting.com > 参见作品集 > 时装秀等...

我需要隐藏当前的 ul 并在其位置显示一个新的。目前，它们一直显示，直到我取消单击父级。

有什么想法吗？

谢谢， 红色

Answer 1

您需要隐藏当前ul 的兄弟姐妹的后代的所有ul 元素，例如

$(this).siblings().find('ul').fadeOut('fast');

这会找到被点击的ul 的每个兄弟（在示例中都是ul）并找到所有在其边界内的ul 元素并将它们淡出。

在您的代码上下文中：

$("nav ul li").find("ul").hide().end()
  .click(function(e) {
     if (this == e.target) {
       $(this).siblings().find('ul').fadeOut('fast');
       $(this).children('ul').fadeToggle('fast');    
     }
});