当另一个打开时关闭一个div - Bootstrap

Question

我正在使用bootstrap本机折叠功能Bootstrap:collapse.js v3.0.2在按下按钮时打开div.它工作得很好,但我想在另一个打开时关闭一个div.目前,作为bootstrap设计它,单个按钮控制特定div的切换.如果我想让一个按钮控制一个部分是好的,但我想知道是否有办法在我的按钮列表中创建任何按钮,在打开其各自的div之前关闭任何打开的div.

我已经在bootstrap.js文件中查看了这段代码*Bootstrap:collapse.js v3.0.2*但是无法想象我们如何做我想要的.

有人能指出我正确的方向,以帮助我确定我需要做什么来获得我正在寻找的功能.

This is the URL to the page I'm developing where you can see the buttons working: http://23.229.158.126/orangecounty-coolsculpting.com/about-orange-county-dualsculpting.html

我不知道是否需要向该文件添加更多代码,或者我是否可以调用Bootstrap Data Attributes来实现此目的.

我研究了这个页面:http://getbootstrap.com/2.3.2/javascript.html#collapse

谢谢你,迈克

Answer 1

据我所知,使用Bootstrap数据属性无法实现您的目标.

因此,您只需添加自定义数据属性并添加一些将处理它的自定义JavaScript:

我使用了以下数据属性:data-collapse-group 和以下javascript:

$("[data-collapse-group='myDivs']").click(function () {
    var $this = $(this);
    $("[data-collapse-group='myDivs']:not([data-target='" + $this.data("target") + "'])").each(function () {
        $($(this).data("target")).removeClass("in").addClass('collapse');
    });
});

jsFiddle中的工作示例基于您的页面.