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

我试图修改Bootstrap折叠插件，让我指定是否点击一个手风琴（打开）应该自动closures手风琴中的其他项目（因此可以一次打开手风琴中的多个项目）

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

bootstrap jQuery插件对于我的技能水平来说有点高级。 我所需要的最相关的部分似乎是在第52行， actives.collapse('hide') 。 如果设置了'data-collapse-type ='manual''（省略属性或设置auto应该保持默认行为），我不希望发生这种情况。

我创造了一个我已经实践的jsfiddle 。

任何人都可以帮助让我在这个正确的轨道？

Answer 1

我已经分叉和更新你的小提琴。

只是去.showfunction，我也写了评论。

http://jsfiddle.net/2Rnpz/

Answer 2

其实， 你不需要修改任何代码 。 从twitterbootstrap网站仔细阅读以下声明

只需将data-toggle =“collapse”和一个数据目标添加到元素即可自动分配可折叠元素的控件。 data-target属性接受一个cssselect器来应用collapse。 确保将类折叠添加到可折叠元素。 如果您希望默认打开，请添加其他课程。

因此，不是使用data-parent='#idofAccordion' ， data-parent='#idofAccordion'使用data-target='#idofCollapseItem' 。

它应该完美地工作。

这里是plunker的演示

Answer 3

因为这个问题并没有提到特定版本的Bootstrap，所以这里有一个引导4解决scheme：从data-toggle="collapse"属性的标签中删除data-parent="#accordion" 。 这是从Collapse文档中取出data-parent=#accordion"位的示例。

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

Answer 4

一次只能打开一个手风琴的技术（即折叠其余部分）是放置data-parent =“＃accordion”data-target =“＃collapseOne”，所以看起来像这样

 <a class="accordion-toggle" data-toggle="collapse" href="#" data-parent="#accordion" data-target="#collapseOne"> Item #1 </a> 

你可以看看它在plunker： http ://plnkr.co/edit/56iXtA?p=preview