javascript - slideToggle melaksanakan kesan menu lipatan, tetapi bagaimana untuk menyedari bahawa mengklik pilihan ini mengembang dan pilihan lain secara automatik runtuh?

Question

Apa yang saya mahu capai ialah menu lipat, tetapi togol slaid hanya boleh diruntuhkan dengan mengklik padanya. Apa yang saya mahu ialah mengklik pada pilihan lain dan menu yang dikembangkan akan runtuh secara automatik.
Kod adalah seperti berikut:
$("> li", ini).setiap(fungsi () {

            $(this).bind("click", function () {
                if($(this).hasClass('active')){
                    //$(".inner ol").hide();
                    //$(this).siblings("ol").slideToggle(settings.speed);
                    $(this).next("ol").slideToggle(settings.speed);
                    $(this).removeClass('active');
                }else{
                    $(this).siblings('li').removeClass('active');
                    //$(".inner ol").hide();
                    $(this).addClass('active')
                    $(this).next("ol").slideToggle(settings.speed);
                }
            });
        });
        //默认折叠
        $("> ol", this).hide();

Answer 1

$(this).siblings().slideUp()

Answer 2

Ideanya adalah seperti berikut:

1 Apabila anda mengklik pada menu semasa, rekodkannya, mula-mula tutup semua menu yang terbuka, dan akhirnya buka sendiri

$(".menu .menu-header").on("click",function(){
    var toggleTarget=$(this);
    //先把其他得关掉
    $(".menu .menu-content").removeClass("active");
    $(this).find(".menu-content").addclass("active");
    
})

Kod di atas hanyalah contoh tunjuk cara, berikan saya idea kasar dan lihat jika ia berkesan

Answer 3

Saya menyemak maklumat dalam talian dan mendapati terdapat fungsi slideup() Hanya gunakannya untuk menggantikan hide().
$("> li", ini).setiap(fungsi () {

            $(this).bind("click", function () {
                if($(this).hasClass('active')){
                    $(".inner ol").slideUp('500');
                    $(this).removeClass('active');
                }else{
                    $(this).siblings('li').removeClass('active');
                    $(".inner ol").slideUp('500');
                    $(this).addClass('active')
                    $(this).next("ol").slideToggle(settings.speed);
                }
            });
        });
        //默认折叠
        $("> ol", this).hide();