ブートストラップ4タブ:クリックされたタブのインデックス番号を取得しますか?

スティーブ

ユーザーがインデックスでクリックしたタブを特定しようとしています。たとえば、5つのタブの2番目をクリックした場合です。

ナビゲーションにIDを追加すると、タブの総数を取得できます。

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>

だから私はクリックされたタブのすべての側面を取得することができますが、それがどの「番号」タブであるかを取得する方法は?

ジム

このような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

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

ブートストラップモーダル内のボタンクリックイベントでアクティブなタブIDを取得します

分類Dev

Firefoxでブックマークされたタブのグループのデスクトップショートカットを作成しますか?

分類Dev

Angularjs:selectタグで選択されたオブジェクトのインデックスを取得します

分類Dev

ブートストラップ-スキップタブインデックスを選択します

分類Dev

タブがクリックされたときにリスナーをクリックします-angular2およびngブートストラップ

分類Dev

各タブをクリックしたときにブートストラップタブのコンテンツを更新できますか?

分類Dev

内部の子オブジェクトから決定されたタイプのジェネリックリストゲッターを実装しますか?

分類Dev

ブートストラップ4タブリンクをクリックすると、angularJSコントローラーが更新されます

分類Dev

与えられたインデックスで、Pythonリストのサブリストを取得しますか?

分類Dev

フォームのテキストボックスとチェックボックスからユーザー入力(アカウント番号、チェックボックス、チェックされたラジオボタンなど)を取得し、データベースからファイルを取得します

分類Dev

アップロードされたffileをパブリックディレクトリとデータベースの両方から削除します

分類Dev

MouseEventオブジェクトからクリックされた要素のインデックス番号を取得する方法

分類Dev

モーダル内のボタンをクリックしてjQueryまたはjavascriptを使用してブートストラップモーダルのデータ値を取得するにはどうすればよいですか?

分類Dev

インターフェイスが返されるプライベートコンストラクターによって生成されたクラスでパブリックEventHandlerをサブスクライブすることは可能ですか?

分類Dev

リストタイプからクラスを派生させました。しかし、私のクラスのインデックススライスは、私自身のオブジェクトではなく、Pythonリストオブジェクトを返します

分類Dev

タブ-タブの1つをクリックした後に表示されるコンテンツ(ブートストラップ)

分類Dev

リンクされたライブラリのターゲットのリストをcmakeで表示する

分類Dev

クラスタープールを指定してデータブリックスノートブックの実行を送信しますか?

分類Dev

タプル内のインデックスによって決定されるint型をコンストラクターが受け取ったさまざまなドライブクラス要素を含むタプルを作成します

分類Dev

エンタープライズライブラリデータアクセスブロックを使用したデータベーススキーマの取得

分類Dev

シェーディングされたインタラクティブな D3 ツリーマップ - 色盲の人をサポートしますか?

分類Dev

ボタンをクリックした後、さまざまなポップアップウィンドウをブートストラップします

分類Dev

ネストされたリストからサブリストを削除します(サブリストのインデックスを検索します)

分類Dev

ボタンがクリックされたら、テーブルビューのセルインデックスを取得します

分類Dev

ブックマークレット:ホストドメインからランダムに指定されたリンクをクリックします

分類Dev

Firebase Cloud Messagingからすべてのサブスクライブされたトピックを取得します

分類Dev

Firebase Cloud Messagingからすべてのサブスクライブされたトピックを取得します

分類Dev

ドロップターゲットオブジェクトのインスタンスを取得します

分類Dev

ブートストラップモーダルのキャンセルボタンは、入力されたデータをクリアしません

Related 関連記事

  1. 1

    ブートストラップモーダル内のボタンクリックイベントでアクティブなタブIDを取得します

  2. 2

    Firefoxでブックマークされたタブのグループのデスクトップショートカットを作成しますか?

  3. 3

    Angularjs:selectタグで選択されたオブジェクトのインデックスを取得します

  4. 4

    ブートストラップ-スキップタブインデックスを選択します

  5. 5

    タブがクリックされたときにリスナーをクリックします-angular2およびngブートストラップ

  6. 6

    各タブをクリックしたときにブートストラップタブのコンテンツを更新できますか?

  7. 7

    内部の子オブジェクトから決定されたタイプのジェネリックリストゲッターを実装しますか?

  8. 8

    ブートストラップ4タブリンクをクリックすると、angularJSコントローラーが更新されます

  9. 9

    与えられたインデックスで、Pythonリストのサブリストを取得しますか?

  10. 10

    フォームのテキストボックスとチェックボックスからユーザー入力(アカウント番号、チェックボックス、チェックされたラジオボタンなど)を取得し、データベースからファイルを取得します

  11. 11

    アップロードされたffileをパブリックディレクトリとデータベースの両方から削除します

  12. 12

    MouseEventオブジェクトからクリックされた要素のインデックス番号を取得する方法

  13. 13

    モーダル内のボタンをクリックしてjQueryまたはjavascriptを使用してブートストラップモーダルのデータ値を取得するにはどうすればよいですか?

  14. 14

    インターフェイスが返されるプライベートコンストラクターによって生成されたクラスでパブリックEventHandlerをサブスクライブすることは可能ですか?

  15. 15

    リストタイプからクラスを派生させました。しかし、私のクラスのインデックススライスは、私自身のオブジェクトではなく、Pythonリストオブジェクトを返します

  16. 16

    タブ-タブの1つをクリックした後に表示されるコンテンツ(ブートストラップ)

  17. 17

    リンクされたライブラリのターゲットのリストをcmakeで表示する

  18. 18

    クラスタープールを指定してデータブリックスノートブックの実行を送信しますか?

  19. 19

    タプル内のインデックスによって決定されるint型をコンストラクターが受け取ったさまざまなドライブクラス要素を含むタプルを作成します

  20. 20

    エンタープライズライブラリデータアクセスブロックを使用したデータベーススキーマの取得

  21. 21

    シェーディングされたインタラクティブな D3 ツリーマップ - 色盲の人をサポートしますか?

  22. 22

    ボタンをクリックした後、さまざまなポップアップウィンドウをブートストラップします

  23. 23

    ネストされたリストからサブリストを削除します(サブリストのインデックスを検索します)

  24. 24

    ボタンがクリックされたら、テーブルビューのセルインデックスを取得します

  25. 25

    ブックマークレット:ホストドメインからランダムに指定されたリンクをクリックします

  26. 26

    Firebase Cloud Messagingからすべてのサブスクライブされたトピックを取得します

  27. 27

    Firebase Cloud Messagingからすべてのサブスクライブされたトピックを取得します

  28. 28

    ドロップターゲットオブジェクトのインスタンスを取得します

  29. 29

    ブートストラップモーダルのキャンセルボタンは、入力されたデータをクリアしません

ホットタグ

アーカイブ