我有(应该是)一个相当简单的 accordion ,行为非常奇怪。下面是HTML:
<div class="panel-group" id="accordion" style="width:100%;margin:0 1% 0 1%;padding:0 0 5px 0;text-align:center">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#main/#Public_Home_Why_Body">
<h3 id="Public_Home_Why">
<strong>
{{Landing_Page_Messages.Why_Title}}
</strong>
</h3>
</a>
</h4>
</div>
<div id="Public_Home_Why_Body" class="panel-collapse collapse in">
<div class="panel-body" style=";text-align:justify">
<font size="4">
{{Landing_Page_Messages.Why_Body}}
</font>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#main/#Public_Home_What_Body">
<h3 id="Public_Home_Why">
<strong>
{{Landing_Page_Messages.What_Can_Do_Title}}
</strong>
</h3>
</a>
</h4>
</div>
<div id="Public_Home_What_Body" class="panel-collapse collapse">
<div class="panel-body" style=";text-align:justify">
<font size="4">
{{Landing_Page_Messages.What_Can_Do_Body}}
</font>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" id="Public_Home_How">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#main/#Public_Home_How_Body">
<h3 id="Public_Home_Why">
<strong>
{{Landing_Page_Messages.How_Does_it_Title}}
</strong>
</h3>
</a>
</h4>
</div>
<div id="Public_Home_How_Body" class="panel-collapse collapse">
<div class="panel-body" style=";text-align:justify">
<font size="4">
{{Landing_Page_Messages.How_Does_it_Body}}
</font>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" id="Public_Home_Your_Role">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#main/#Public_Home_Your_Role_Body">
<h3 id="Public_Home_Your_Role">
<strong>
{{Landing_Page_Messages.Your_Role_Title}}
</strong>
</h3>
</a>
</h4>
</div>
<div id="Public_Home_Your_Role_Body" class="panel-collapse collapse">
<div class="panel-body" style=";text-align:justify">
<font size="4">
{{Landing_Page_Messages.Your_Role_Body}}
</font>
</div>
</div>
</div>
</div>
当页面打开时,折叠面板的第一个“文件夹”处于打开状态(而不是关闭)。我单击的任何面板都会打开和关闭第一个条目,但我单击的面板主体保持折叠状态。
我显然有一个错字,但是,在重读了几十遍之后,我还是找不到它。它在哪里?
1条答案
按热度按时间klr1opcd1#
找到问题了!!!
在代码的某个地方有另一个元素与 accordion 的一个面板同名。老实说,我只是偶然发现了它(!)。
这也解释了为什么Skelly和ProgrammerV 5执行的测试有效(在他们检查的片段中没有名称冲突)。
非常感谢那些花时间测试它的人。