Question

我正在尝试使用JS从列表结构外部的链接触发Bootsrap 4手风琴/标签窗格。我正在尝试使用数据属性跳转到选项卡窗格，而JQuery则切换手风琴，因为我无法看到如何使用数据属性（如果可以，请更正我）。我的链接显示正确的选项卡窗格，但它不会展开手风琴：

HTML：

<a id="standToggle" data-toggle="collapse" data-target="#stand-visual" href="#stand-visual">Trigger accordion tab</a>

<li class="nav-item">
  <a class="nav-link nav-has-child" data-toggle="collapse" href=".collapseStandBuild" aria-expanded="false" aria-controls="collapseStandBuild">Stand Build &amp; Information</a>
</li>
<li class="nav-item nav-sub-item collapse collapseStandBuild">
  <a class="nav-link" id="stand-visual-tab" data-toggle="tab" href="#stand-visual" role="tab" aria-controls="stand-visual" aria-selected="false">Stand Visual</a>
</li>
<li class="nav-item nav-sub-item collapse collapseStandBuild">
  <a class="nav-link" id="stand-av-tab" data-toggle="tab" href="#stand-av" role="tab" aria-controls="stand-av" aria-selected="false">Stand AV</a>
</li>

<div class="tab-pane fade" id="stand-visual" role="tabpanel" aria-labelledby="stand-visual-tab">
  ...
</div>
<div class="tab-pane fade" id="stand-av" role="tabpanel" aria-labelledby="stand-av-tab">
  ...
</div>

JQuery的：

// toggle accordion on link click
$(document).ready(function(){
  $("#standToggle").click(function(){
   $("#stand-visual").collapse('toggle'); // toggle collapse
  });
});

我该如何运作？

使用JS切换Bootstrap手风琴

0 个答案: