Question

我有一个JSP页面，它使用bootstraps data-toggle =＆＃34; tab＆＃34;功能。页面加载后，我激活了一个标签。

<ul class="nav st-nav-tabs">
    <li class="active"><a href="#tab1" data-toggle="tab">First Tab</a></li>
    <li><a href="#tab2" data-toggle="tab">Second Tab</a></li>
</ul>

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

我在页面上有一个Highcharts图表，只要用户点击其中一个列，我就调用了JS函数，这使得tab2成为页面上的活动标签。在这个功能中，我尝试了一些不同的命令，但似乎都没有。我对jQuery很陌生，所以我希望有人能够指出我的语法出错的地方。

function handleClick(){
    //I've tried the following, none seem to work
    $('#tab2').toggleClass('active');
    $('#tab2').show();
    $('#tab2').tab('show');
}

Answer 1

首先你需要给你的标签id，我会称之为myTabs：

<ul class="nav st-nav-tabs" id="myTabs">

然后，您可以按名称调用并显示标签，以显示它们：

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

您可以在bootstrap的documentation中阅读有关标签的信息。

bootstrap data-toggle =＆＃34; tab＆＃34; - 如何使用JS调用激活标签

1 个答案: