Событие Click в загрузочном блоке 3 вкладки

17

У меня есть следующий HTML:

<div id="channels">
    <ul class="nav nav-tabs" id="ul-channels">
        <li class="channel" data-roomid="lobby"><a class="link-channel" href="#lobby" data-toggle="tab">lobby</a></li>
        <li class="channel active selected" data-roomid="test"><a class="link-channel" href="#test" data-toggle="tab">test</a></li>
    </ul>
</div>

Мне нужно событие, которое происходит при переключении вкладок. Вот так:

$('.nav-tabs a').click(function (e) {
    alert("Q");
});

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

    
задан Denis 30.09.2013 в 16:15
источник
  • Попробовать $ ('. nav-tabs'). bind ('click', function (e) {...}); и не забывайте готовый обработчик DOM –  karthikr 30.09.2013 в 16:18
  • @karthikr, спасибо, это работа! –  Denis 30.09.2013 в 16:20
  • «В отношении jQuery 1.7 метод .on () является предпочтительным методом для привязки обработчиков событий к документу». от api.jquery.com/bind –  DanFromGermany 01.10.2013 в 14:41

1 ответ

42

Последнее решение:

$(document).on( 'shown.bs.tab', 'a[data-toggle="tab"]', function (e) {
   console.log(e.target) // activated tab
})
    
ответ дан Denis 01.10.2013 в 14:36
источник
  • Как я могу изменить этот код, так что пока на вкладке [data-toggle="tab:] срабатывает последнее одно событие, но если на других вкладках происходит другое событие. –  Greg L 07.01.2014 в 22:40
  • @Greg L, я думаю, мы должны попробовать следующее: $ (document) .on ('показано.bs.tab', 'a [data-toggle="tab"]: last', function (e) {console .log (e.target) // активированная вкладка}) $ (document) .on ('показано.bs.tab', 'a [data-toggle="tab"]: not (: last)', function (e ) {console.log (e.target) // активированная вкладка}) –  Denis 08.01.2014 в 07:25
  • Хорошо. Но как я могу получить событие, если снова щелкнула текущая открытая вкладка? –  Bryce 26.05.2014 в 23:15
  • @Bryce, как я знаю, show.bs.tab и shows.bs.tab не позволяют выполнять эту задачу. –  Denis 27.05.2014 в 07:14
  • Любая идея, почему данные в официальном руководстве не работают и что нужно использовать «документ»? –  Nishanthan 02.09.2014 в 14:41