Bootstrap 4选项卡:获取单击的选项卡的索引号?

时间:2018-09-19 18:18:51

标签: javascript jquery bootstrap-4

我试图通过索引来确定用户点击了哪个标签他们点击了五个标签中的第二个。

我可以通过在导航栏中添加ID来获得标签总数:

findAny()

从Bootstrap 4文档中,我可以单击一下选项卡:

this.numTabs = $('#myTabset').children().length;

哪个日志:

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

因此,我可以获得单击选项卡的所有方面,但是如何获取它是哪个“数字”选项卡?

2 个答案:

答案 0 :(得分:0)

像这样使用jQuery .index()方法...

$('a[data-toggle="tab"]').on('shown.bs.tab', function(e) {
    var idx = $(this).index('a[data-toggle="tab"]');
});

演示:https://www.codeply.com/go/GeNHX340fc

答案 1 :(得分:0)

如果要获取当前所选标签的索引,请执行以下操作

let tabIndexNumber = $('#myTab a[aria-selected="true"]').index('a[data-toggle="tab"]');

ID #myTab是引导选项卡的ID。它会产生一个从零开始的数值,零是第一个标签。