0

クリックされた要素に子がulある場合に別のものを開くjQueryクリックメニューを探しています-このようなものです。li

<ul>
    <li><a href"#">Item 1</a>
        <ul>
            <li><a href"page1.html">Item 1 child 1</a></li>
            <li><a href"page2.html">Item 1 child 2</a></li>
            <li>
                <a href"#">Item 1 child 3</a>
                <ul>
                    <li><a href"#">Item 1 child 3 child</a></li>
                </ul>
            </li>
        </ul>
    </li>
    <li><a href"page3.html">Item 2</a></li>
    <li><a href"page4.html">Item 3</a></li>
</ul>

「Item 1」をクリックすると新しいリストが開き、「Item 1 child 3」をクリックするとさらに別のリストが開きます。

かつて見たこと.nextがあると思いますが、よくわかりません。

4

3 に答える 3

1

これはあなたが必要とすることをするはずです:

$("a").click(function(e){
   $(this).closest("li").children("ul").toggle();
});​

$("a").click();//quick hack to hide all children to start with (if desired)

実用的な例については、こちらをご覧ください

これはスライド効果のある例です(コメントで示唆されています)


ノート

この.children関数を使用すると、親が再拡張されると、すべての「サブ拡張」が「保持」されることになります。私には、これは自然な動作のように見えます。

親を閉じると、すべてのサブ展開がリセットされ、次に親が展開されたときにも閉じられるようにする場合は、次の.find方法を使用できます。.children

また、このコードがページ上のすべてのAリンクに適用されることを考慮する必要があります。これを適用するAリンクをより具体的にする必要がある場合は、セレクターを変更する必要があります。UL要素内にAリンクのみを含める1つの例は、次のようになります。

$("ul a").click(...
于 2012-04-27T10:36:19.537 に答える
0

jQuery アコーディオン プラグインを使用することは、要件に対する理想的なアプローチです。実装方法の詳細については、ここで jQuery Accordionを参照してください。

于 2012-04-27T10:37:41.737 に答える
0

完全な実装ではありませんが、これは私が推測するのに役立つはずです:

$("list").click(function(){
  $(this).find("ul").show();
});

つまり、「find()」を使用して子要素を取得できます。

編集: 最初のオカレンスが必要な場合は、「first()」API を使用します。

参照: http://api.jquery.com/first/

于 2012-04-27T10:39:14.560 に答える