jQueryを使用して新しく作成された要素にイベントハンドラを自動的に追加

Question

ドキュメントの準備ができたら、このイベントハンドラをクラスbubbleItemOffを持つすべての要素にアタッチします。 私の問題は、いくつかのbubbleItemOff要素が、文書準備完了イベントが発生した後に動的に作成されることです。

新しく作成された要素にイベントハンドラを自動的に追加する方法はありますか、要素を作成した後に明示的に行う必要はありますか？

$(function() { 
     $('.bubbleItemOff').mouseenter(function(e) 
     { 
      //... 
     }); 
    }); 

Answer 1

on()メソッド（jQuery 1.7.x +を使用していると仮定します）を使用して、共通の親要素でイベント委任を使用します。

$(function() { 
    $('body').on('mouseenter', '.bubbleItemOff', function(e) 
    { 
    ... 
    } 
} 

古いバージョンを使用している場合は、代わりにdelegate()を使用してください。最初の共通親要素が.bubbleItemOffのbodyを変更します。

Answer 2

あなたは委任 - イベントのアプローチでjQueryのon方法を使用することができます。ここでは

$(".parentItem").on("mouseenter", ".bubbleItemOff", function(e) { 
    // 
}); 

.parentItem

は .bubbleItemOffのいずれかの親を指します。