Javascript 标签"；如图所示；事件未触发-Twitter引导

当一个选项卡发生变化时，我试图触发一个ajax调用。然而，我甚至无法让这个基本测试正常工作：

<ul class="nav nav-tabs">
   <li class="">
      <a data-toggle="tab" href="#gqs-uploader" id="gqs-uploader-btn">Upload</a>
   </li>
   <li class="active">
      <a data-toggle="tab" href="#gqs-results" id="gqs-results-btn">Results</a>
   </li>
   <li class="">
      <a data-toggle="tab" href="#gqs-download" id="gqs-download-btn">Download</a>
   </li>
</ul>

当任何选项卡发生更改时，它应向我发送警报

为什么这个简单的示例不起作用？

文档中的基本示例也不起作用。整个事件（甚至按钮点击）似乎都看不见——我似乎无法捕捉到它。

试试这个

$(document).on('shown.bs.tab', 'a[data-toggle="tab"]', function (e) {
    alert('TAB CHANGED');
})

---

尝试此代码，检查是否正常工作

（函数（$）{
$（函数（）{
$（document）.on（'show.bs.tab'，'a[data toggle=“tab”]”，函数（e）{
警报（“选项卡已更改”）；
});
}); 
}（jQuery））；

这来自引导文档：

您有4项活动：

---

隐藏，显示，隐藏，显示

你的引导版本是什么？当前版本3.1.1的引导文档提到显示的选项卡事件名称是

show.bs.tab

就是这样，-我的一个愚蠢的疏忽-读取错误版本的文档。没问题。如果它回答了你的问题，别忘了接受它：）有趣的是，这是谷歌关键词“tab change event bootstrap”的第一个结果并没有为我的AngularJS代码触发事件。但是，此解决方案成功地触发了该事件。

$(document).on('shown.bs.tab', 'a[data-toggle="tab"]', function (e) {
    alert('TAB CHANGED');
})

<ul class="nav nav-tabs">
   <li class="">
      <a data-toggle="tab" href="#gqs-uploader" id="gqs-uploader-btn">Upload</a>
   </li>
   <li class="active">
      <a data-toggle="tab" href="#gqs-results" id="gqs-results-btn">Results</a>
   </li>
   <li class="">
      <a data-toggle="tab" href="#gqs-download" id="gqs-download-btn">Download</a>
   </li>
</ul>

<script>
    (function ( $ ) {
        $(function () {
            $(document).on('shown.bs.tab', 'a[data-toggle="tab"]', function (e) {
                alert('TAB CHANGED');
            });
        }); 
    }(jQuery));
</script>

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
  e.target // newly activated tab
  e.relatedTarget // previous active tab
})