Question

我们有一个主菜单，可以包含任何数字或父子项。我们希望隐藏所有孩子的UL，然后点击给定的孩子UL显示的孩子。

你可以在这里看到这个程度：http://jsfiddle.net/JnL58/12/

$("ul.nav_categories ul").hide();

$("ul.nav_categories li").click(function(el){
    el.preventDefault();
    var cur_el = $("> ul", this);
    if (cur_el.length > 0) {
        $("> ul", this).show();
    }
});

我们正在努力解决的问题是隐藏相关的UL的APART来自点击的元素父UL或兄弟Ul。

所以基本上它是一个像http://jsfiddle.net/FjCcT/4/这样的下拉菜单，适用于点击而不是翻转：

$("ul.nav_categories ul").hide();
$("ul.nav_categories li").hover(function(){
    if ($("> ul", this).length > 0) {
        $("> ul", this).show();
    }
}, function(){
    if ($("> ul", this).length > 0) {
        $("> ul", this).hide();
    }
});

请注意，这需要在不同级别上工作，例如2,3,4和5个深度。这些列表是动态的，所以我们不知道级别的数量。

Answer 1

总编辑。当然，解决方案必须非常简单。：3

$("ul.nav_categories ul").hide();

$("ul.nav_categories li").click(function(){
    $('li > ul').not($(this).parents('ul')).hide();
    $(this).find('> ul').show();
    return false;
});

http://jsfiddle.net/Bhnzc/3/

jQuery列表项菜单

1 个答案: