0

折りたたみ可能なセクションを作成するために、nextUntil と slideToggle に苦労しています。ラッパーを使用してこれを行うことができることは知っていますが、編集せずに既存のファイルにこれを追加できるようにしたいので、本当にしたくありません。私の目的は、(例えば)を持つファイルを管理することです

<h1>Heading</h1><p>some stuff></p>
   <h2>heading</h2><p>blah....</p>
   <h2>heading</h2><p>blah....</p>    
   <h2>heading</h2><p>blah....</p>
<h1>Heading</h1><p>some stuff></p><p>more stuff</p>
   <h2>heading</h2><p>blah....</p>
   <h2>heading</h2><p>blah....</p>    
   <h2>heading</h2><p>blah....</p>

また、関連する見出しをクリックして h1 見出し間の内容を展開/折りたたむことができますが、h1 見出しがクリックされたときに「いくつかのもの」と h2 見出しのみを表示し、クリックするまで h2 見出しの下の内容を折りたたんだままにしますh2 見出し。

1段だけなら結構いける

function collapsible(tag)
{
    $(tagname).nextUntil(tag).hide(); //hide everyting between one <tag> and the next
    $(tag).click(function(){    
        $(this).nextUntil(tag).slideToggle(500);
        });//handler to toggle visibility of the content between this <tag> and the next
}

しかし、求められるまで h2 見出しの下のすべてを確実に非表示のままにする方法を見つけることができました。多分誰かがアイデアを持っています。考えられるすべての場所を検索しましたが、これに対する解決策のようなものは見つかりませんでした。ご指摘ありがとうございます。

4

1 に答える 1

0

これがあなたがやろうとしていることだと思います:

$(function () {
    $('h2,p').hide();
});    

test = function (me) {
    $(me).nextUntil('h2').slideToggle(500);
    $(me).nextUntil('h1').filter('h2').slideToggle(500).off('click').on('click', function () {
        $(this).next("p").slideToggle(500);
    });
}

jsiddle 例はこちら

于 2014-02-24T00:27:11.097 に答える