jQuery data-toggle="tab" ，在页面加载时激活第二个选项卡
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/23750482/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
data-toggle="tab" , activating second tab on page load
提问by user2598808
I know this question has already been asked, I have gone through the previous questions but somehow nothing worked for me so I thought I should post this.
我知道已经有人问过这个问题，我已经完成了之前的问题，但不知何故对我没有任何帮助，所以我想我应该发布这个。
I want to highlight the second tab on page load and when a particular button is clicked, I want to highlight the first tab.
我想在页面加载时突出显示第二个选项卡，当单击特定按钮时，我想突出显示第一个选项卡。
Setting class as "Tab Pane Active" for the second tab doesn't work.
将第二个选项卡的类设置为“选项卡窗格活动”不起作用。
<ul class="nav nav-tabs">
<li><a href="#search" data-toggle="tab">Search</a></li>
<li><a href="#home" data-toggle="tab">User Details</a></li>
<li><a href="#info" data-toggle="tab">More Info</a></li>
</ul>
<div class="tab-content" id="tabs">
<div class="tab-pane" id="search">...Content...</div>
<div class="tab-pane active" id="home">...Content...</div>
<div class="tab-pane" id="info">...Content...</div>
</div>
回答by Josh Davenport
You have an active class on the 2nd tab pane, showing that initially, but not on the actual tab li. So you're seeing the second tabs content, but not a selected state on the tab. You need to change:
您在第二个选项卡窗格上有一个活动类，最初显示，但不在实际的选项卡 li 上。所以你看到的是第二个选项卡的内容，但不是选项卡上的选定状态。你需要改变：
<li><a href="#home" data-toggle="tab">User Details</a></li>
to
到
<li class="active"><a href="#home" data-toggle="tab">User Details</a></li>
And to select tabs with jQuery:
并使用 jQuery 选择选项卡：
// To select the first tab
$('.nav-tabs li:first-child a').tab('show');
// To select the second tab
$('.nav-tabs li:eq(1) a').tab('show');
You can use this on page load if you like (within $(document).ready()or whatever you're using), though it's probably just best to fix the markup. You can use it within your event listener for your button.
如果您愿意（在$(document).ready()您使用的范围内或使用的任何内容），您可以在页面加载时使用它，尽管最好修复标记。您可以在按钮的事件侦听器中使用它。
See this example: http://www.bootply.com/kkmcecadLb
请参阅此示例：http: //www.bootply.com/kkmcecadLb
