按钮类切换问题与Bootstrap Accordion&银色条纹

Button class toggle Issue with Bootstrap Accordion & Silverstripe

本文关键字：amp Accordion 问题 Bootstrap 按钮      更新时间：2023-09-26

我正在使用Bootstrap的手风琴进行一个基于Silversstripe的项目。标记模拟的Bootstrap的文档如下所示，有以下区别：aria-expanded="false"和panel-collapsed没有类in，因为我希望默认情况下关闭所有项。

 <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
   <div class="panel panel-default">
     <div class="panel-heading" role="tab" id="heading1">
       <h4 class="panel-title">
         <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapse1" aria-expanded="false" aria-controls="collapse1">
         Panel title
         </a>
       </h4>
     </div>
     <div id="collapse1" class="panel-collapse collapse" role="tabpanel" aria-labelledby="heading1">
       <div class="panel-body">
         Lorem ipsum
       </div>
     </div>
   </div>
 </div>

它按预期加载，所有项目都已关闭。单击面板标题可按预期打开和关闭面板主体。但是，该操作会在打开时将class="collapsed"添加到.panel-title > a，并且不会在随后的单击中删除它。

这就是我的问题——我需要这个类像Bootstrap的例子一样切换（打开时没有类，折叠时折叠类），这样我就可以为每种情况设置不同的标题样式。

我花了几个小时在这上面，不明白为什么它不起作用。我已经复制了Bootstrap的代码，肯定有最新版本的Bootstrap.min.js。我不认为我遗漏了什么，但也许我只是看了太久了。请帮忙！

好的，所以问题是该项目是用Silversstripe构建的，它重写哈希链接以在锚之前指定URL，所以它在锚链接之前添加了"/"。

解决方案是禁用哈希链接，或者编写一个自定义处理程序来删除折叠的类。

已将原始问题编辑为包含Silverstepe。

相关文章：