jquery - JQueryはセレクターではなく.on（）を使用します

Question

私はこの構文で.on（）関数を使用しています：

$(".schemaTab").on("click", ".schema", function () {})

divを動的.live()に追加しているからではありません。.schemaそれらのdivには次のコードがあります。

<div class="schema" id="SCH_16">
   <img src="Img/btnRemove.png" class="ikona SCH_Remove" alt="Smazat" title="Smazat">
</div>

しかし、親divのクリックイベントからimgを除外する必要があるので、それを行う方法はありますか？

私は試した：

$(".schemaTab").not(".SCH_Remove").on("click", ".schema", function () {})

...しかし、それは機能せず、コード.not()内に追加する方法がわかりません.on()

score 22 · Accepted Answer

onメソッドはイベントハンドラーをjQueryオブジェクトで現在選択されている要素のセットにアタッチし、元のセレクターを使用してイベントを適用するかどうかをテストするため、.not（）は機能しません。

だから私はあなたの場合に選択してからフィルタリングすることでうまくいくと思います。

あなたはこれを試すことができます：

$(".schemaTab").on("click", ".schema", function (e) {

    if (!$(e.target).is(".schemaTab")) {
         // not stuff in here
    }

});

score 10 · Accepted Answer

このように、実際にはメソッドで:notセレクターを使用できます。.on

これは、Tats_innitの回答に従って結果をフィルタリングするよりもクリーンなソリューションです。

$('.schemaTab').on('click', '.schema:not(.booga)', function(event) {
  // Fun happens here
});

jQuery1.11.0を使用しています。

score 4 · Accepted Answer

ターゲットが一致することを確認してください。

$('.schemaTab').on('click', '.schema', function(e) {
    if(!$(e.target).is('.schema')) {
        return;
    }

    // Do stuff
});

score 3 · Accepted Answer

これを行うことの全体的なポイントは、.sch_Removeを含むDOMにまだ含まれていない要素のイベントを処理することです。

$(".schemaTab").on("click", ".schema", function () {})

そのimgがクリックされたときに親クリックアクションがトリガーされないようにするには、（上記の関数に加えて）以下を追加します。

$(".schemaTab").on("click", ".SCH_Remove", function () { return false; })

これにより、「クリック」イベントが親に伝播してそのonclickメソッドをトリガーするのを防ぎ、デフォルトのクリック動作を防ぎます。

4 に答える 4