使用 JQuery 切换手风琴 [英] Toggle an Accordion with JQuery

问题描述

我收到了一个手风琴，它不会切换每个标签的打开和关闭.它仅在选择另一个标题时关闭选项卡，但我希望用户也能够在点击时关闭它.我不确定如何编辑此 Jquery 以允许这种情况发生.

I had an accordion given to me that is not toggling each tab open and close. It only closes the tab when another title is selected, but I'd like the ability for the user to close it on click as well. I'm not sure how to edit this Jquery to allow this to happen.

jQuery("ul.gdl-accordion li").each(function(){
    jQuery(this).children(".accordion-content").css('height', function(){ 
        return jQuery(this).height(); 
    });
    if(jQuery(this).index() > 0){
        jQuery(this).children(".accordion-content").css('display','none');
    }else{
        jQuery(this).find(".accordion-head-image").addClass('active');
    }       

    jQuery(this).children(".accordion-head").bind("click", function(){
        jQuery(this).children().addClass(function(){
            if(jQuery(this).hasClass("active")) return "";
            return "active";
        });
        jQuery(this).siblings(".accordion-content").slideDown();
        jQuery(this).parent().siblings("li").children(".accordion-content").slideUp();          jQuery(this).parent().siblings("li").find(".active").removeClass("active");
    });
});

我假设它在 .click 函数的某个地方，在那个 if 语句中......但我不确定为什么.

I'm assuming it's somewhere in the .click function, in that if statement... but I'm not sure why.

我也不知道为什么它默认第一个标签是打开的......有没有办法修改它?

I'm also not sure why it is defaulting the first tab as open... is there a way to modify that as well?

http://jsfiddle.net/FKAAM/

非常感谢任何建议.非常感谢 SO.

Any advice is greatly appreciated. Many thanks SO.

推荐答案

使用 slideToggle() 代替:

Use slideToggle() instead:

jQuery(this).siblings(".accordion-content").slideDown();

jQuery(this).siblings(".accordion-content").slideToggle();

http://jsfiddle.net/FKAAM/4/

这篇关于使用 JQuery 切换手风琴的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！