如何让 Twitter Bootstrap Accordion 保持一组开放？

我正在尝试使用 Twitter 引导程序使用手风琴和折叠插件来模拟 Outlook 栏，到目前为止，我已经实现了折叠和手风琴工作，但它目前允许折叠所有部分。

我想限制它，以便始终显示一个且仅一个。

这是我正在研究的一个：http://jsfiddle.net/trajano/SMT9D/我认为这与

$('#accordions').on('hide', function (event) {
  console.warn("HIDE TRIGGERED, check if trying to hide the active one if so stop");
})

这是一个简单的方法：

引导程序4

$('.accordion .btn-link').on('click', function(e) { 
  if (!$(this).hasClass('collapsed')) { 
    e.stopPropagation(); 
  } 
});

来自@mr_joncollette 的评论

引导程序3

JsFiddle对于 Bootstrap 3。

Bootstrap 3 的代码：

$('.panel-heading a').on('click',function(e){
    if($(this).parents('.panel').children('.panel-collapse').hasClass('in')){
        e.stopPropagation();
    }
    // You can also add preventDefault to remove the anchor behavior that makes
    // the page jump
    // e.preventDefault();
});

该代码检查单击的元素是否是当前显示的元素（按“in”类）如果它确实有“in”类，它就会停止隐藏过程。

已弃用的 Bootstrap 2

JsFiddle对于引导程序 2。

Bootstrap 2 的代码：

$('.accordion-toggle').on('click',function(e){
    if($(this).parents('.accordion-group').children('.accordion-body').hasClass('in')){
        e.stopPropagation();
    }
    // You can also add preventDefault to remove the anchor behavior that makes
    // the page jump
    // e.preventDefault();
});

Note: 如果您想在手风琴上附加更多点击事件，请小心，因为e.stopPropagation()将阻止检查后发生的事件。