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 で自分のページのドロップダウン メニューを作成していますが、現在、レベル 1 のリストをクリックすると、クリックされたものを開きたいときにすべてのレベル 1 が開きます。すなわち。最初の1をクリックすると、これが行われます:

1

    2

1

    2

これをしたいとき

1

    2

1

$this 関数を使用して選択したものだけを開くことができることは理解していますが、それを実装する方法がわかりません。

解釈しやすくするために、スタイルを設定したアクティブなページを含めました: 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 マークアップを作成すると、作業が簡単になります。

編集:コメントに従って(マークアップが変更されました!!!)

ある要素単位で何らかの選択基準に基づいて要素を選択したい場合は、nextUntil関数を使用します。

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

サンプルhttp://jsfiddle.net/K6TSv/1072/

于 2012-06-11T03:44:23.987 に答える