jquery - jQuery：Accordian Toggle - 当兄弟姐妹打开时关闭 Div

Question

我有一个手风琴开关，目前工作正常，但我想要它，所以一次只能展开一个项目。当您打开一个项目并打开另一个项目时，我希望原始项目关闭。

关于我应该添加到我的代码中以使其正常工作的任何想法？

这是代码：

$(document).ready(function() {

$('.internal').hide();

$('.slider').click(function() {

    $(this).next('.internal').slideToggle();
}).toggle(function() {
    $(this).children("span").html("minus sign");
}, function() {
    $(this).children("span").html("plus sign");
});

});

我在这里设置了一个小提琴：http: //jsfiddle.net/Lg9Mn/17/

谢谢！

Answer 1

在显示正确的元素之前，只需使用类internal（使用）隐藏所有元素：slideUp

$(document).ready(function() {

    $('.internal').hide();

    $('.slider').click(function() {
        $('.internal').slideUp();
        $('.slider').not($(this)).children("span").html("plus sign");
        if($(this).next('.internal').css("display") == "none"){
            $(this).next('.internal').slideDown();
            $(this).children("span").html("minus sign");
        }else{
            $(this).next('.internal').slideUp();
            $(this).children("span").html("plus sign");
        }
    })
});

http://jsfiddle.net/Lg9Mn/30/

Answer 2

试试这个代码

$(document).ready(function() {

    $('.internal').hide();

    $('.slider').click(function() {
        $('.internal').not($(this).next('.internal')).hide();
        $('.slider').not($(this)).children("span").html("plus sign");

        if( $(this).next('.internal').is(':visible')){
            $(this).children("span").html("plus sign");
        }
        else{
            $(this).children("span").html("minus sign");
        }
        $(this).next('.internal').slideToggle();
    });
});

需要将此添加到您的点击事件中

$('.internal').not($(this).next('.internal')).hide();

检查小提琴