0

クラス「ajaxsubnote」がクリックされたときに何かを行うjquery関数があります

$('.ajaxsubnote').click(function(){
     //do something....
})

ただし、ユーザーはjqueryを介してクラス「ajaxsubnote」を持つ要素を動的に追加できます。私の問題は、これらの動的に追加された要素がクリックされたときに、上記の関数を呼び出していないように見えることですが、元々DOMにあるものは...

これを回避する方法はありますか？

4

3 に答える 3

2

bind/click イベントと委任された on イベントの違いは、これが非常に重要です。

バインドまたはクリックなどのショートカットを使用すると、指定されたイベントがその時点で特定のセレクターに一致するすべての要素にバインドされます。このセレクターはスナップショットであり、新しい要素が追加されても更新されません。

イベント委任を使用する場合、静的親セレクターを提供してから、動的要素セレクターを提供します。親セレクター内の任意の場所をクリックすると、jQuery は、ターゲットが親セレクターと一致するかどうかを確認します。ターゲットが 2 番目のセレクターと一致する場合、イベントがトリガーされます。これは、毎回イベントをバインドする必要なく、イベント トリガーの条件に一致する要素を親コンテンツ セクションに追加および削除できることを意味します。

http://api.jquery.com/on/

したがって、必要なものは次のようなものです。

$(parentElement).on( "click", ".ajaxsubnode", function(){
     //do something....
});

parentElement は、可能なすべての ajaxsubnode クラスの親でありながら、可能な限り具体的です。

于 2012-10-26T16:39:49.097 に答える
2

動的要素を処理するには、委任されたイベント メソッドを使用する必要があります。下記参照、

// v--- replace document with closest parent container that exist in DOM
$(document).on('click', '.ajaxsubnote', function(){
     //do something....
})

古いバージョンの場合、デリゲートを使用します。

// v--- replace document with closest parent container that exist in DOM
$(document).delegate('.ajaxsubnote', 'click', function(){
     //do something....
})
于 2012-10-26T16:35:08.530 に答える
1

on()クリックイベントを委任するには、関数を使用する必要があります

$("dynamicContainerElement").on("click", "dynamicallyAddedElement", 
     function () 
     { 
        /* Your code here */
     });

http://api.jquery.com/on/

于 2012-10-26T16:35:03.703 に答える