1 
$(function(){
    $("li.level2").hide();
    $("li.level3").hide();

    $("ul.navigation").delegate("li.level1", "click", function() {
        $("li.level2").toggle().siblings("li.level3").hide();;
    });

    $("ul.navigation").delegate("li.level2", "click", function() {
        $("li.level3").toggle();
    });
});

我正在使用此脚本在 jquery 中为我的页面创建一个下拉菜单，但是当前当您单击 level1 列表时，它会打开每个 level1，而我只想打开被单击的那个。IE。当我单击第一个 1 时，它正在执行此操作：

1

    2

1

    2

当我想让它这样做时

1

    2

1

我知道您可以使用 $this 功能仅打开选定的一个，但我不确定如何实现它以及每当我尝试 (this).next 时，它只会打开下一个

我包含了一个带有样式的活动页面，以便于解释：http: //jsfiddle.net/K6TSv/1045/

感谢您的帮助，这一直在推动我前进。

4

1 回答 1

2

使用获取单击的项目$(this)，然后获取下一个 level2 项目并显示。

$("ul.navigation").delegate("li.level1", "click", function() {
    var item=$(this);
    item.next(".level2").toggle();      
});

jsfiddle 示例：http: //jsfiddle.net/K6TSv/1046/

如果我这样做。我会创建一个分层的 HTML 标记来处理这个问题，这将使事情变得容易

编辑：根据评论（标记已更改！！！）

如果要根据某些选择标准 unitl 某些元素来选择元素，请使用nextUntil函数。

$(this).nextUntil(".level1",".level2").toggle();

示例http://jsfiddle.net/K6TSv/1072/

于 2012-06-11T03:44:23.987 回答