折叠插件：一次只显示一个面板

Posted 2023-03-24

【中文标题】折叠插件：一次只显示一个面板

【英文标题】：Collapse plugin: Only show one panel at a time

【发布时间】：2013-03-04 21:31:14

【问题描述】：

我很难弄清楚这一点，也许我只是没有搜索正确的术语。

我有一个常规的 twitter 折叠面板。我只希望它一次显示一个面板。

默认情况下，它允许您一次打开所有面板，但我希望它在您展开另一个面板时自动关闭任何其他打开的面板。

http://twitter.github.com/bootstrap/javascript.html#collapse

<div class="accordion" id="monogram-acc">

<div class="accordion-group">
    <div class="accordion-heading">
    <div class="accordion-toggle" data-toggle="collapse" data-parent="monogram-acc" href="#Animals">
        Animals
    </div>
</div>
    <div class="accordion-body collapse" id="Animals">
        //... content
    </div>
</div>

<div class="accordion-group">
    <div class="accordion-heading">
        <div class="accordion-toggle" data-toggle="collapse" data-parent="monogram-acc" href="#Food">
            Food
        </div>
    </div>
    <div class="accordion-body collapse" id="Food">
        // ... content
    </div>
</div>
//... so on
</div>

http://jsfiddle.net/AbtmY/

【参考方案1】：

http://jsfiddle.net/AbtmY/1/

改变

data-parent="monogram-acc"

到

data-parent="#monogram-acc"