如果显示另一个元素，如何隐藏折叠的元素

Question

我有 3 个按钮，单击时会折叠并显示一个表单。我想要的是，如果一个已经折叠，那么如果单击另一个，我希望它再次隐藏。

我的小提琴：https : //jsfiddle.net/77soggnv/

这是我的js代码：

$(document).ready(function(){

    //See which panel has been clicked
    $("#citizen").click(function(){
        $(this).data('clicked', true);
    });
    $("#organisation").click(function(){
        $(this).data('clicked', true);
    });
    $("#anonymous").click(function(){
        $(this).data('clicked', true);
    });

    //Hide the other panels if one is clicked
    if($("#citizen").data('clicked')){
        $("#organisation").collapse("hide");
        $("#anonymous").collapse("hide");
    }
    if($("#organisation").data('clicked')){
        $("#citizen").collapse("hide");
        $("#anonymous").collapse("hide");
    }
    if($("#anonymous").data('clicked')){
        $("#organisation").collapse("hide");
        $("#citizen").collapse("hide");
    }    

});

Answer 1

只需您可以这样做：

$(".btn").click(function(){
    $('.collapse.in').collapse('hide');
});

更新的小提琴