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

查看:90
本文介绍了使用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");
    });
});

我假设它在中。单击函数,在该 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/

任何建议都非常感谢。非常感谢。

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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆