Question

我有一个带有不同标签的页面，我想通过页脚单独链接到这些标签页。我已经检查了其他解决方案，但我不确定两件事。我已经尝试使用以下javascript来解决这个问题，但我不确定如何配置这里的内容：

A）如何配置JavaScript以使用我的HTML？

B）我是否需要为页面上的每个标签复制以下JS？

// Javascript to enable link to tab
var url = document.location.toString();
if (url.match('/info#advertise-tab')) {
  $('.nav-tabs li a[href="info' + url.split('#')[1] + 'advertise-tab"]').tab('shown.bs.tab');
}

// Change hash for page-reload
$('.nav-tabs li a').on('shown.bs.tab', function (e) {
  window.location.hash = e.target.hash;
})

我的页面视图：

<ul class="nav nav-tabs" role="tablist">
  <li role="presentation" id="advertise-li"><a href="#advertise-tab" aria-controls="advertise-tab" role="tab" data-toggle="tab">Advertise</a></li>
  <li role="presentation" id="legal-li"><a href="#legal-tab" aria-controls="legal-tab" role="tab" data-toggle="tab">Legal</a></li>
</ul>

<div class="tab-content" id="infoTabContent">
  <div role="tabpanel" class="tab-pane fade" id="advertise-tab">
    <p>stuff</p>
  </div>
  <div role="tabpanel" class="tab-pane fade" id="legal-tab">
    <p>other stuff</p>
  </div>
</div>

页脚链接：

<a href="/info#advertise-tab">Advertise</a>
<a href="/info#legal-tab">Legal</a>

Here is the jsfiddle

如何链接到页面上的特定选项卡Bootstrap＆amp;导轨

0 个答案: