Bootstrap 4 вкладки: получить номер индекса по нажатой вкладке?

Question

Я пытаюсь выяснить, на какой вкладке пользователь щелкнул по его индексу, например, он нажал на вторую из пяти вкладок.

Я могу получить общее количество вкладок, добавив идентификатор в навигационную панель.:

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

из документа Bootstrap 4, я могу получить нажатую вкладку:

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

Какие журналы:

<a class="nav-link" data-toggle="tab" href="#profileS" role="tab" aria-selected="false">Profile</a>

Таким образом, я могу получить все аспекты выбранной вкладки, но как узнать, какая это вкладка «номер»?

Answer 1

Если вы хотите получить индекс текущей выбранной вкладки, выполните следующие действия:

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

Идентификатор #myTab - это идентификатор вкладки начальной загрузки.Он создает нулевое числовое значение, ноль - первая вкладка.

Answer 2

Используйте метод 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