JQueryクリックイベントの.onリスナーの子セレクターの値を取得します

jhoog

JQuery .on()イベントハンドラーを使用してdiv内に動的に追加されたクリックされたアイテムのID値を取得するようにJSを設定しています。私の現在のコードは次のとおりです。

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="parentDiv">
    <i id="test1">1</i>
    <i id="test2">2</i>
    <i id="test3">3</i>
</div>

<script>
$("#parentDiv").on('click', 'i[id^="test"]', function() {
    var child_id = $(this).id;
    child_id = child_id.replace("test","");
    alert(child_id);
});
</script>

<i>私はそれらのクリックに対して直接聞くことができないので、要素が動的に追加されます。正しく機能していないように見える領域は次の行です。var child_id = $(this).id;完全に正しく機能していないか、親IDを取得していないようですが、子IDは取得していません。親データではなく、クリックされた子セレクターを取得するコマンドはありますか?

iota

要素をjQueryオブジェクト(つまり、でラップせずに使用する.propか、直接アクセスしますidthis.id

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="parentDiv">
    <i id="test1">1</i>
    <i id="test2">2</i>
    <i id="test3">3</i>
</div>

<script>
$("#parentDiv").on('click', 'i[id^="test"]', function() {
    var child_id = $(this).prop('id');
    child_id = child_id.replace("test","");
    console.log($(this).prop('id'), this.id);
    console.log(child_id);
});
</script>

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

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

編集
0

コメントを追加

0

関連記事

分類Dev

クリックイベントのJQueryセレクター

分類Dev

'セレクターを使用してjQueryの「.on」クリックイベントを削除します。

分類Dev

親コンテナをターゲットにし、jQueryの子入力チェックボックスのクリックイベントを無視する

分類Dev

jqueryのクリックイベントリスナー

分類Dev

ターミナルセッションの「クローズ」イベントをリッスンします

分類Dev

'a'タグのjqueryトリガークリックイベント

分類Dev

同じセレクターを持つ別の子セレクターでイベントをクリックします

分類Dev

新しいelement.JQueryのイベントリスナー(クリック)

分類Dev

Jqueryのn番目の子セレクターをインクリメントします

分類Dev

WPFTreeViewの[イベント]をクリックして選択した子ノードの値を取得する

分類Dev

jqueryのホバーをクリックイベントに変換します

分類Dev

クリックイベントリスナーを介してネストされた要素の属性値を取得します

分類Dev

クリックしたアイテムのFirebaseデータベースから子の値を取得する方法

分類Dev

Swift:-カスタムテーブルビューセルのボタンクリックでラベル値を1つインクリメントします

分類Dev

jQueryの未定義の値のクリックイベント

分類Dev

<select>のJS 'クリック'イベントリスナーは2回クリックしていますか?

分類Dev

ラジオボタンjqueryのイベントをクリックします

分類Dev

イベントリスナーをクリックします

分類Dev

子セレクターからデータ属性の値を取得します

分類Dev

子要素のクリックイベントが親クリックイベントをトリガーする

分類Dev

Scala.jsのクリックイベントリスナー内でタグ名を取得するには?

分類Dev

クリックイベントロジックのjQuery

分類Dev

jqueryのクリックイベントのIfステートメント

分類Dev

クラスの最初の子のIDを取得し、そのonclickイベントをトリガーします

分類Dev

TFSデータベース-コレクション内のファイルのリストを取得します

分類Dev

jQuery セレクターの ID 値をインクリメントする

分類Dev

別のクリックイベント内のアンカータグをクリックしますか?

分類Dev

リファクタリングのjQueryのInViewイベントリスナー

分類Dev

クリックイベントjQueryのcurrentTargetの正しい使用

Related 関連記事

  1. 1

    クリックイベントのJQueryセレクター

  2. 2

    'セレクターを使用してjQueryの「.on」クリックイベントを削除します。

  3. 3

    親コンテナをターゲットにし、jQueryの子入力チェックボックスのクリックイベントを無視する

  4. 4

    jqueryのクリックイベントリスナー

  5. 5

    ターミナルセッションの「クローズ」イベントをリッスンします

  6. 6

    'a'タグのjqueryトリガークリックイベント

  7. 7

    同じセレクターを持つ別の子セレクターでイベントをクリックします

  8. 8

    新しいelement.JQueryのイベントリスナー(クリック)

  9. 9

    Jqueryのn番目の子セレクターをインクリメントします

  10. 10

    WPFTreeViewの[イベント]をクリックして選択した子ノードの値を取得する

  11. 11

    jqueryのホバーをクリックイベントに変換します

  12. 12

    クリックイベントリスナーを介してネストされた要素の属性値を取得します

  13. 13

    クリックしたアイテムのFirebaseデータベースから子の値を取得する方法

  14. 14

    Swift:-カスタムテーブルビューセルのボタンクリックでラベル値を1つインクリメントします

  15. 15

    jQueryの未定義の値のクリックイベント

  16. 16

    <select>のJS 'クリック'イベントリスナーは2回クリックしていますか?

  17. 17

    ラジオボタンjqueryのイベントをクリックします

  18. 18

    イベントリスナーをクリックします

  19. 19

    子セレクターからデータ属性の値を取得します

  20. 20

    子要素のクリックイベントが親クリックイベントをトリガーする

  21. 21

    Scala.jsのクリックイベントリスナー内でタグ名を取得するには?

  22. 22

    クリックイベントロジックのjQuery

  23. 23

    jqueryのクリックイベントのIfステートメント

  24. 24

    クラスの最初の子のIDを取得し、そのonclickイベントをトリガーします

  25. 25

    TFSデータベース-コレクション内のファイルのリストを取得します

  26. 26

    jQuery セレクターの ID 値をインクリメントする

  27. 27

    別のクリックイベント内のアンカータグをクリックしますか?

  28. 28

    リファクタリングのjQueryのInViewイベントリスナー

  29. 29

    クリックイベントjQueryのcurrentTargetの正しい使用

ホットタグ

アーカイブ