Question

我正在努力创造一种手风琴效果。我可以这样做，该部分已扩展，但我无法弄清楚如何关闭已经打开的部分。

你能帮我一把吗？

function cws_accordion_init (){
    jQuery.fn.cws_accordion = function () {
        jQuery(this).each(function (){
            var sections = jQuery(this).find(".accordion_section");
            sections.each( function (index, value){
                var section_index = index;
                jQuery(this).find(".accordion_title").on("click", function (){
                    jQuery(this).siblings(".accordion_content").slideDown("300");
                    sections.eq(section_index).addClass("active");
                    sections.eq(section_index).siblings().removeClass("active").find(".accordion_content").slideUp("300");
                });
            });
        });
    }
}

HTML

<section class='cws-widget'>

    <section class='cws_widget_content toggle_widget'>
        <div class='accordion_section featured_check_up'>
            <div class='accordion_title'>title 1</div>
            <div class='accordion_content' style='display: none;'>
                <p>fhshjsjf isfi fhsuhsj dsihdisj dshd disd jdijd shd is disu</p>
            </div>
        </div>

        <div class='accordion_section featured_check_up'>
            <div class='accordion_title'>title 2</div>
            <div class='accordion_content' style='display: none;'>
                <p>djjdjdijisjdisjidjsijdisjdisjdis</p>
            </div>
        </div>



    </section>

</section>

Answer 1

这将切换所选的手风琴并关闭所有其他手风琴：

$(".accordion_title").on("click", function (){
  $(this).siblings(".accordion_content").slideToggle("300");
  $(this).addClass("active");
  $(".accordion_title").not(this).removeClass("active");
  $(".accordion_title").not(this).siblings(".accordion_content").slideUp("300");
});

关于jquery的手风琴。我无法关闭活动元素

1 个答案: