1

すべての機能を展開/折りたたみしようとしています。右上にボタンがあり、ユーザーがすべてを展開したり折りたたんだりできる、展開可能なアイテムのリストがあります。

現在、私のコードは、すべてが一緒に展開/折りたたまれている場合は機能しますが、ユーザーがいくつかの(すべてではない)要素を展開すると正しく機能しません。折りたたまれた/展開された要素を切り替えるだけです。JSFiddle

実行されているjQueryコードは次のとおりです。

$('div.srcprojects').hide();
$('.projectscontainer').on("click", "span.destproject", function (){
    $(this).siblings('.srcprojects').toggle().end().siblings('div.destarrow').toggleClass("arrow-right arrow-down");
}).on("click", "div.destarrow", function (){
    $(this).parent().find("span.destproject").trigger("click");
});

$('body').on("click", "span#expandcollapse", function (){
    $(this).text(function(i, currentText){
        return currentText === 'Expand All' ? 'Collapse All' : 'Expand All';
    });
    $('body').find("span.destproject").trigger("click");
});

#expandcollapseが実際にすべてを展開する/すべてを折りたたむようにするにはどうすればよいですか?

4

3 に答える 3

1

コードを完全に分析することなく、jQueryのtoggleメソッドは単に可視性をからshowhide、またはその逆に切り替えることを指摘しておきます。一方向に切り替えたいだけの場合は、次のことができます。

.toggle(true)表示および .toggle(false)非表示

http://api.jquery.com/toggle/#toggle-showOrHide

于 2013-03-20T22:22:33.693 に答える
0

私はあなたが簡単にできると信じています

$("#expandcollapse").on("click",function(e) {
    $(".projectscontainer").find(".srcprojects").toggleSlide();
});

これにより、スライドが切り替えられたときに、スライドアップ/ダウンアニメーションが表示されます。

于 2013-03-20T22:43:51.933 に答える
0

トグルを使用すると、それが行われます。

私はあなたが探しているものを正確に理解しているかどうかはわかりませんが、うまくいけば、この小さな例があなたをそこに連れて行くことができます:

$('#expandcollapse').click(function () {
    $('.projectscontainer').each(function () {
        //Code to manipulate the elements here, like .show()/.hide()
    }); 
});
于 2013-03-20T22:18:20.747 に答える