Bootstrap Accordion按钮切换“数据父级”不起作用

Bootstrap Accordion按钮切换“数据父级”不起作用

引导程序4

使用

data-parent=""

折叠元素（而不是触发器元素）上的属性

<div id="accordion">  <div >    <div >      <h5>        <button  data-toggle="collapse" data-target="#collapseOne">          Collapsible #1 trigger        </button>      </h5>    </div>    <div id="collapseOne"  data-parent="#accordion">      <div >        Collapsible #1 element      </div>    </div>  </div>  ... (more cards/collapsibles inside #accordion parent)</div>

---

引导程序3

在GitHub上查看此问题：

.panel

使用该

data-parent

属性时，有一个“bug”使手风琴依赖于类。要解决此问题，您可以将每个手风琴组包装在一个“面板” div中。

<div  id="myAccordion">    <div >        <button type="button"  data-toggle="collapse" data-target="#collapsible-1" data-parent="#myAccordion">Question 1?</button>        <div id="collapsible-1" > ..        </div>    </div>    <div >        <button type="button"  data-toggle="collapse" data-target="#collapsible-2" data-parent="#myAccordion">Question 2?</button>        <div id="collapsible-2" > ..        </div>    </div>    <div >        <button type="button"  data-toggle="collapse" data-target="#collapsible-3" data-parent="#myAccordion">Question 3?</button>        <div id="collapsible-3" >...        </div>    </div></div>

编辑

如评论中所述，每个部分都不必是

.panel

。然而…

• .panel

  必须是用作的元素的直接子元素

  data-parent=

• 每个手风琴节（

  data-toggle=

  ）必须是

  .panel

  （http://www.bootply.com/AbiRW7BdD6#）的直接子级