Question

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

<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的属性不会改变css对类div2的影响。

这是您的固定项目：Editable Bootply sample

手风琴 - 一个嵌套在某个div中的面板

1 个答案: