在来自另一个链接 Bootstrap 的选项卡导航中设置活动选项卡

Question

编辑：这不是我的主导航栏，它是表单内的导航栏。此 Tab Nav 仅存在于 resources-terms.html

我有一个位于resources-terms.html 的标签导航

<div class="tabbable">
  <ul class="nav nav-tabs" id="tab_bar">
      <li class="active"><a href="#tab1" data-toggle="tab"><i class="glyphicon glyphicon-pencil"></i>AU and NZ Terms & Conditions</a></li>
      <li><a href="#tab2" data-toggle="tab"><i class="glyphicon glyphicon-user"></i> UK Terms & Conditions </a></li>
   </ul>

    <div class="tab-content">
        <div class="tab-pane active" id="tab1"> Content 1</div>
        <div class="tab-pane active" id="tab2"> Content 2</div>
    </div>
</div>

假设我正在查看index.html，我需要直接转到resources-terms.html 的链接格式应该是什么？tab2 已经选中并处于活动状态？

我尝试了<a href="resources-terms.html#tab2>Link</a>"，但没有成功。

Answer 1

您正在寻找的内容（通过location.hash 值导航到特定选项卡）不会自行发生。您需要在 resources-terms.html 文件中处理此问题。

页面完全加载后，读取hash并将对应的tab设置为active，如下图：

$(document).ready(function(){
    if (location.hash) {
        $('a[href=' + location.hash + ']').tab('show');
    }
});