通过JS获取当前活动选项卡。

Question

我想在BOOTSTRAP中将当前标签显示为有效。

<ul class="nav nav-tabs">               
    <!-- Default tab -->
    <li class="active"><a href="#elemLower_tab" data-toggle="tab">Elementary Lower</a></li>
    <li><a href="#elemAdvance_tab" data-toggle="tab">Elementary Advance</a></li>
    <li><a href="#secondary_tab" data-toggle="tab">Secondary</a></li>               
</ul>

我想通过jQuery激活当前标签？有没有办法做到这一点？

Answer 1

尝试

$('.nav-tabs .active').text()

Answer 2

使用此JS代码。

$(function(){
var url = window.location.pathname,
urlRegExp = new RegExp(url.replace(/\/$/,'') + "$");
$('ul.nav-tabs li a').each(function(){
if(urlRegExp.test(this.href.replace(/\/$/,''))){
$(this).addClass('active');
}
});
});

使用CSS：将Active类附加到

ul.nav-tabs a.active{color:#000;}

Answer 3

如果您想在当前标签发生变化时运行JavaScript代码，请参阅tabs plugin documentation中的show和shown个事件。