修改Twitter Bootstrap折叠插件以保持手风琴打开

Question

我正在尝试修改Bootstrap折叠插件,以允许我指定单击手风琴(打开)是否应该自动关闭手风琴中的其他项目(因此手风琴中的多个项目一次可以打开)

我想在手风琴上创建一个新的数据属性,比如 data-collapse-type="auto|manual"

引导jQuery插件对我的技能水平来说有点先进.我需要弄乱的最相关的部分似乎是在第52行actives.collapse('hide').如果设置了'data-collapse-type ="manual"',我不希望发生这种情况(省略属性或设置auto应保持默认行为).

我创造了一个我经历过的jsfiddle.

任何人都可以帮助我走上正轨吗？

Answer 1

实际上,您不需要修改任何代码.请仔细阅读twitterbootstrap网站上的以下声明

只需将data-toggle ="collapse"和数据目标添加到元素即可自动分配对可折叠元素的控制.data-target属性接受css选择器以应用折叠.请务必将类折叠添加到可折叠元素.如果您希望它默认打开,请添加其他类.

所以不要使用data-parent='#idofAccordion',请使用data-target='#idofCollapseItem'.

它应该完美.

这是关于plunker的演示

Answer 2

我已经分叉并更新了你的小提琴.

只是去.show函数,我也写了评论.

http://jsfiddle.net/2Rnpz/

Answer 3

由于该问题并未涉及 Bootstrap 的特定版本，因此这里有一个 bootstrap 4 解决方案：data-parent="#accordion"从具有该data-toggle="collapse"属性的标签中删除 。这是从 Collapse 文档中取出的示例data-parent=#accordion"。

bootply: https://www.bootply.com/3wV4WbzBtT#