Bootstrap 手风琴:subcollapse 应该在 supercollapse 关闭时关闭

Bootstrap Accordion: subcollapse should close on close of supercollapse

<div id="accordion">
    <a role="button" data-parent="#accordion" href="#supercollapse1"> ITEM1 </a>
    <div id="supercollapse1">
            <a role="button" data-toggle="collapse" href="#subcollapse1" onclick=updateContent()> SUBITEM1 </a>
            <div id="subcollapse1">
                CONTENT
            </div>
    </div>
    <a role="button" data-parent="#accordion" href="#superollapse2"> ITEM2 </a>
    <div id="supercollapse2">
            <a role="button" data-toggle="collapse" href="#subcollapse2" onclick=updateContent()> SUBITEM2 </a>
            <div id="subcollapse2">
                CONTENT
            </div>
    </div>
</div>

发生了什么 当我打开 supercollapse1,然后打开 subcollapse1,然后打开 supercollapse2 时,supercollapse1 与 subcollapse1 一起关闭,supercollapse2 打开。然后我打开 supercollapse1 - supercollapse2 关闭并且 supercollapse1 和 subcollapse1 打开。

我想达到的效果当supercollapse1和subcollapse1打开我打开supercollapse2时,supercollapse1和subcollapse1一起关闭,所以subcollapse1再次打开supercollapse1不显示

Motive 所有子折叠共享一个内容项,该内容项在每次打开时生成。因此,当我已经打开 subcollapse1,然后打开 subcollapse2 并返回到 subcollapse1 - 它已经打开并且不会生成内容。

尽量表达清楚。伪代码例子没有冒犯。

干杯

如果我没看错,关闭 1 级手风琴应该关闭 1 级手风琴内部的 2 级手风琴

看看这个 fiddle:https://jsfiddle.net/459nzh32/

诀窍是监听 1 级手风琴的 hide event,然后找到它的子级并关闭它们,这里是 jquery 的示例:

$('.level1').on('hidden.bs.collapse', function () {
  $(this).find('.level2').collapse('hide');
});