jQuery手风琴菜单子项错误--白屏答案

【问题标题】：jQuery accordion menu subitem error--white screenjQuery手风琴菜单子项错误--白屏
【发布时间】：2021-11-09 04:06:05
【问题描述】：

我有一个带有 Vue 和 bootstrap 的 Laravel 7 站点，并且我有一个带有 jquery 手风琴菜单的页面。当您点击其中一个可展开的

即使 HTML 源代码存在于后台，它也会显示白屏...帮助？

https://dev8.oddballsinvitations.net/category

【问题讨论】：

标签： jquery vue.js laravel-7

【解决方案1】：

看起来您的点击事件正在触发一个“淡出”类，该类被应用到您的 html 正文标签，而不是针对手风琴 div。

截图

https://paste.pics/DV1C4

这是 bootstrap 5.0 文档中手风琴 html 的外观。

  <div class="accordion-item">
    <h2 class="accordion-header" id="headingOne">
      <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
        Accordion Item #1
      </button>
    </h2>
    <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
      <div class="accordion-body">
        <strong>This is the first item's accordion body.</strong> It is shown by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the <code>.accordion-body</code>, though the transition does limit overflow.
      </div>
    </div>
  </div>
</div>```

【讨论】：