手動更改aria-expanded =「true」不會打開新選項卡

Question

我想在某些操作爲真後再打開另一個選項卡。 在這裏你可以看到我的bootstrap導航欄和jQuery腳本。

<ul class="nav navbar-default nav-justified" role="tablist" id="navbar"> 
<li role="presentation" class="active"><a id="tab1" href="#home" aria-controls="home" role="tab" data-toggle="tab">Home</a></li> 
<li role="presentation" ><a id="tab2" href="#msg" aria-controls="msg" role="tab" data-toggle="tab">Messages</a></li> 
</ul> 

這裏是腳本。

$("#password-button").on("click", function() { 

    if($("#password-name").val() === password) { 

    $("#tab1").attr("aria-expanded", "false"); 
    $("#tab2").attr("aria-expanded", "true"); 

    } 
    } 

Firebug顯示我它改變了這些屬性，但沒有任何反應？

Answer 1

使用.tab()屬性來顯示或隱藏Jquery中的選項卡。試試這個：

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

Working DEMO