Bootstrap data-toggle 在第二次点击后折叠 div，而不是第一次点击

Question

我有一个使用 Bootstrap 并通过单击切换 div 的 简单示例。这是标记：

 <div class="accordion-heading">
    <a class="accordion-toggle"
       data-toggle="collapse"
       data-parent="#accordion2"
       href="#collapseOne">Open!</a>
</div>
<div id="collapseOne" class="accordion-body">
    <div class="span6">
        <div class="well well-small">
            <div class="accordion-toggle">
                ...some text...
            </div>
        </div>
    </div>
    <div class="span2"></div>
</div>

当用户点击标题为“打开！”的链接时基础 div 展开或折叠。 Div 最初是展开的，当用户第一次点击时它没有任何效果。然后，如果用户第二次单击，div 会折叠。

在 原始示例 中，div 最初是折叠的，但我希望将其打开。我该如何解决这个问题？

原文由 Pupkin 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

只需将类“collaspe in”添加到 class=“accordion-body”。

在 CODEPEN 检查示例代码

HTML:

 <div class="accordion-heading">
    <a class="accordion-toggle"
       data-toggle="collapse"
       data-parent="#accordion2"
       href="#collapseOne">Open!</a>
</div>
<div id="collapseOne" class="accordion-body collapse in">
    <div class="span6">
        <div class="well well-small">
            <div class="accordion-toggle">
                ...some text...
            </div>
        </div>
    </div>
    <div class="span2"></div>
</div>

我希望这能解决您的问题。享受 ：）

原文由 Jyoti Pathania 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

我遇到了这个问题，在我的例子中，我愚蠢地在我想要折叠的 div 中插入了两个“类”属性：

 <div class="something" id="mydiv" class="collapse in"> <div>

浏览器似乎消除了第二类属性而不是合并它们。

我的问题是通过将两个类属性“合并”在一起来解决的：

 <div id="mydiv" class="something collapse in"> <div>

原文由 Thundzz 发布，翻译遵循 CC BY-SA 4.0 许可协议