默认选项卡的选项卡事件未触发答案

【问题标题】：Tab event not firing for default tab默认选项卡的选项卡事件未触发
【发布时间】：2015-08-21 05:53:48
【问题描述】：

我有 3 个选项卡，其中 1 个在页面加载时处于活动状态。我已将事件与选项卡相关联。代码如下：

HTML：

<ul class="nav nav-tabs nav-justified">
    <li class='active'><a href="#id1" data-toggle="tab" id="q0" class="qtab"></a></li>
    <li><a href="#id2" data-toggle="tab" id="q1" class="qtab"></a></li>
    <li><a href="#id3" data-toggle="tab" id="q2" class="qtab"></a></li>
</ul>

JS：

$('.qtab').on("shown.bs.tab", function(event){
    var elem = $(this).attr("id");
    alert(elem);
});

更改选项卡时会显示警报框，但显示默认选项卡（ID 'q0'）时不会显示。有谁知道我如何也可以为默认选项卡触发事件？提前致谢！！

【问题讨论】：

show.bs.tab 也会发生这种情况吗？
请在 plunkr 或 jsfiddle 上提供一个示例，我会解决它
@Stef 是的，我试过了，现在你说了。结果是一样的。
奇怪，我在这个小提琴中得到了它，虽然没有看到你所有的代码，我无法真正告诉你发生了什么变化：jsfiddle.net/DTcHh/11340
@Stef 这对我也有用，但是当页面加载时，第一个选项卡是否会显示该警报框。第一个标签是默认标签，所以当页面打开时不应该显示警告框吗？

标签： javascript jquery

【解决方案1】：

根据Tab Events 的引导文档：

shown.bs.tab：（在新激活的刚刚显示的选项卡上，与 show.bs.tab 事件相同）

您必须在这里挖掘潜台词，但看起来此事件仅在活动选项卡更改时触发。要解决这个问题，请从您的第一个选项卡中删除 active 类（因为如果选项卡已经处于活动状态，该事件也不会被触发）并在页面加载时使用以下行在 jQuery 中设置活动选项卡（也来自Bootstrap 文档）：

$('.nav a[href="#id1"]').tab('show') // Select tab by name

请参阅我的updated fiddle 进行演示。

【讨论】：