twitter bootstrap 3在js中設置活動選項卡不起作用

Question

是的，所以這已被問了大約1000次，但我嘗試了答案，似乎沒有人為我工作。

這是我的標簽：

<ul class="nav nav-tabs">
    <li><a href="#profile" data-toggle="tab">Profile</a></li>
    <li><a href="#account" data-toggle="tab">Account</a></li>
    <li><a href="#security" data-toggle="tab">Security</a></li>
    <li><a href="#recruiting" data-toggle="tab">Recruiting</a></li>
</ul>

注意，默認情況下，沒有設置為活動。 選項卡窗格：

<div class="tab-content">
    <div class="tab-pane fade" id="account">
        Account
    </div>
    <div class="tab-pane fade" id="security">
        Security
    </div>
    ...more...
</div>

在我的js中，我按照bootstrap文檔執行此操作：

$(window).load(function () {
        $('#tab a:first').tab('show');
    });

沒有任何表現。 我想要做的是讓它默認打開第一個標簽，但根據我傳入的一些數據，我想在需要時調用它：

$('#tab a:[href="#security"]').tab('show');

Answer 1

第一個問題在這里：

$('#tab a:first').tab('show')

#tab引用了id="tab" ，但你沒有。 將#tab替換為.nav-tabs或向ul添加ID：

$('.nav-tabs a:first').tab('show')

你的第二個問題是你忘了刪除:旁邊的a ：

$('.nav-tabs a:[href="#security"]').tab('show')

它應該是：

$('.nav-tabs a[href="#security"]').tab('show')

Answer 2

您有:在您的選擇器中，將其更改為

 $('#tab a[href="#security"]').tab('show');

代替

 $('#tab a:[href="#security"]').tab('show');