html - Accordion - 一个嵌套在一些 div 中的面板

Question

如何在 div 中嵌套一个面板？ 问题是当这个嵌套在 div 中的面板打开时，当我打开其他面板时无法关闭。我需要这个，因为我要隐藏几个面板。我想设置显示嵌套面板的div:无。

<div class="panel-group" id="accordion1">
<div class="panel panel-default">
    <div class="panel-heading">
        <h4 class="panel-title">
            <a data-toggle="collapse" data-parent="#accordion1" href="#collapseOne">
                Collapsible Group Item #1
            </a>
        </h4>
    </div>
    <div id="collapseOne" class="panel-collapse collapse">
        <div class="panel-body">Panel 1</div>
    </div>
</div>
<div class="panel panel-default">
    <div class="panel-heading">
        <h4 class="panel-title">
            <a data-toggle="collapse" data-parent="#accordion1" href="#collapseTwo">
                Collapsible Group Item #1
            </a>
        </h4>
    </div>
    <div id="collapseTwo" class="panel-collapse collapse">
        <div class="panel-body">Panel 2</div>
    </div>
</div>
<div class="divWhichIWantHide">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h4 class="panel-title">
                <a data-toggle="collapse" data-parent="#accordion1" href="#collapseThree">
                    Collapsible Group Item #1
                </a>
            </h4>
        </div>
        <div id="collapseThree" class="panel-collapse collapse">
            <div class="panel-body">Panel 3</div>
        </div>
    </div>
</div>

SAMPLE

Answer 1

将一个 div 包装到另一个 div 时，问问自己:这个特定的 div 有什么特别之处？可以避免这个 div 吗？

一般来说，当你添加一个 div 来包裹另一个 div 时，可以这样说:

<div class="div1">
    <div class="div2"></div>
</div>

您可以将“类”合并到它们自己，就像您在 Bootstrap 组件中看到的那样:

<div class="div1 div2"></div>

这样做，您只需确保 div1 的属性不会改变类 div2 的 css 效果。

这是您的固定元素:Editable Bootply sample