在引导程序中以编程方式更改选项卡窗格选项卡

Question

我正在使用定义为的选项卡窗格

    <ul class="nav nav-tabs">
                   <li><a href="#personal" data-toggle="tab">Personal Information</a></li>
                   <li class="active"><a href="#contact"   data-toggle="tab">Contact</a></li>
                   <li><a href="#guardian"  data-toggle="tab">Parent/Guardian Information</a></li>
                   <li><a href="#education" data-toggle="tab">Educational Background</a></li>
                   <li><a href="#recommendations" data-toggle="tab">Study Prospects</a></li>
                </ul>


<div class="tab-content">                

                <div class="tab-pane" id="personal"></div>
                <div class="active tab-pane" id="contact"></div>
                <div class="tab-pane" id="guardian"></div>       
</div>

可以看出，我选择了联系人作为第一个选择的选项卡，但是当我刷新页面<在整页加载时它会自动将选项卡更改为个人选项卡，即第一个选项卡。

有什么办法可以通过javascript等手动切换标签吗？

Answer 1

有一个更改选项卡的解决方案，因此您需要

1- 将最后一个标签保留在某处

2-页面刷新时调用以下函数

这怎么称呼

activaTab('tab1');


function activaTab(tab){
  $('.nav-tabs a[href="#' + tab + '"]').tab('show');
};

Answer 2

这是您需要的代码。

HTML：

<li id="contact"><a href="#contact"   data-toggle="tab">Contact</a></li>

JavaScript：

window.onload = function() {
  document.getElementById('contact').classList.add('active'); 
};