0

最大3レベルの深さの拡張可能/折りたたみ可能なテキストを可能にするように設計されたWordPressプラグインによって生成されているHTMLがあります。第1レベルまたは第2レベルを折りたたんで、その下の子も展開した場合、それらも折りたたまれますが、私が使用するものではすべての子を選択できないようにしたいと思います。これは私が今まで使っているものです:

$(".hidden-text-toggle").click(function () {
    if ($(".hidden-text:animated").length) return false;
        $(this).next().slideToggle();
        if ($(this).hasClass('expanded') ){     
            $(this).removeClass('expanded');
            $(this).animate({ backgroundColor: "black" , color: "red"});    
        }
        else
        {
            $(this).addClass('expanded');
            $(this).animate({backgroundColor: "red" , color: "black"});

        }
        return false;
    });

<div class="wrapper">
    <h2 class="title">Level One</h2>
    <div class="text" href="#">
        This is level one text.
        <div class="wrapper">
            <h2 class="title" href="#">Level Two</h2>
            <div class="text">
                This is level two text.
                <div class="wrapper">
                    <h2 class="title" href="#">Level Three</h2>
                    <div class="text">                          
                        This is level three text. 
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

4行目の後に何かを置くことでこれが可能になると思っていたでしょ$(this).find(".text").slideUp();うが、どうやら私は間違っています。

どんな助けでも大歓迎です!

4

2 に答える 2

0

すべての要素に対して包括的slideUpを実行できます(これはfindと組み合わせて実行します)。

$("div.wrapper").find("div").slideUp();

これは基本的に、ルートノードの下にあるすべてのdivを選択し、それぞれの高さをゼロにアニメーション化することに注意してください。すでに高さがゼロになっている要素は影響を受けません。

于 2012-06-26T06:03:00.230 に答える
0

試す:

$("h2.title").click(function () {
    $(this).next().slideToggle();
});​

フィドル: http: //jsfiddle.net/iambriansreed/amppK/

ドキュメント:http ://api.jquery.com/toggle-event/

于 2012-06-26T08:12:40.833 に答える