1

Ruby on Rails を使用して複数のリンクを取得し、それらをクラス 'head' またはクラス 'link' の複数の li 要素を持つ単一の ul に配置する Web サイトに取り組んでいます。

私はこれでアコーディオン スタイルの効果を動作させようとしているので、ユーザーが「頭」li をクリックすると、後続の子「リンク」li が表示され、別の「頭」li をクリックすると消えます。

私はjquery uiのアコーディオンについて知っていますが、プロジェクトで使用されているレールコードのオプションだとは思いません。私はただのインターンであり、CTO が私に合うようにコードをやり直すことに時間を費やすかどうかはわかりません。持てる力を出し切って頑張っています。

コードの例:

<ul>
    <li class = "head">HEAD</li>
        <li class = "link">link</li>
        <li class = "link">link</li>
        <li class = "link">link</li>
    <li class = "head">HEAD</li>
        <li class = "link">link</li>
        <li class = "link">link</li>
        <li class = "link">link</li>
    <li class = "head">HEAD</li>
        <li class = "link">link</li>
</ul>

<script>
    $('li.link').hide();

    $('li.head:first-child').click(function(){
        $('li.link').slice(0, 3).slideToggle('slow');
    });
</script>

これは、これまでのところ、目的の効果に最も近いものです。私が得た助けに心から感謝します。

4

2 に答える 2

3

あなたは本当にそれをほとんどうまくやっていますが.head、それらすべてではなく最初のクリックをターゲットにしているだけです. それよりも、.nextUntil()メソッドは目的の要素をターゲットにするのに役立ちます.

ライブデモ

$('li.link').hide();

$('li.head').click(function(){
    $(this).nextUntil('.head').slideToggle('slow');
});

ドキュメント:
http://api.jquery.com/nextuntil/

于 2013-09-09T21:28:27.123 に答える