【Twitter Bootstrap 3.0】Tabのshownイベントの取得方法 | 超キレやすいプログラマのブログ

超キレやすいプログラマのブログ

キレてキレてキレまくる

Twitter Bootstrap 3.0 で、Tabのshownイベントが取得できなくてはまったのでメモ。
2.Xとはやり方が変わっていた。

最初は2.Xの形式

// タブ変更イベントのキャッチ
$("a[data-toggle=tab]").on("shown", function (e) {
// タブ変更時の処理
});


と書いてみたが、一向にイベントをキャッチできない。
英語読めない俺が死ぬ思いでstackcverflowとかTwitterBootstrapの本家サイトを頑張って読んで作ったのに、ピクリとも動かなかったときの虚無感は凄かったぜ・・・orz

仕事仲間に相談したところ、3.0で変わったようだ・・・とのこと。
正しくは以下だった。

// タブ変更イベントのキャッチ
$("a[data-toggle=tab]").on("shown.bs.tab", function (e) {
// タブ変更時の処理
});


・・・ちょ待てや。明らかに3.0の方が不自然な気がするんだが、気のせいだろうかきゃはっ


【参考サイトと引用】
http://getbootstrap.com/getting-started/#migration-dropped
JavaScript events are namespaced. For example, to handle the modal "show" event, use 'show.bs.modal'. For tabs "shown" use 'shown.bs.tab', etc..