jQueryロードのベストプラクティス

Question

jQueryロードのベストプラクティスについて質問があります。次のような状況を想像して：

$("#div").on('click', function() { 
$('#result').load('test.html'); 
}); 

コードが正常に動作し、負荷の方法が実行されますが、今ロードされたコンテンツは、jQueryプラグインによってアクセスすることができません。私はこのような解決：私の質問は簡単です

$("#div").on('click', function() { 
$('#result').load('test.html', function(){ 
$('.element').plugin(); 
}); 
}); 

、この状況を解決するための良い方法はありますか？

Answer 1

理想的には、のは、この例のコンテナ<div id="wrap">を言わせて... id="div"を持つ要素のparentをターゲットにする必要があります。その後、ロードされたコンテンツを他のプラグインによってアクセスすることができ

$("#wrap").on("click", "#div", function() { 
$('#result').load('test.html'); 
}); 

：その後のようなセレクタとしてparentの容器を使用して.on()を使用しています。

.on()を使用するこの形式は、実際には.live()をjQuery v1.7.x以降に置き換えました。

結局、あなたはまた、

$("body").on("click", "#div", function() { 
$('#result').load('test.html'); 
}); 

Answer 2

あなたは正しい方法でそれをやっています。プラグインメソッドを呼び出すコードは、ロードがdivにロードされた後にのみ実行されます。だからあなたは行くのが良いです。

おそらく、document.ready内にすべてのコードをラップして、domがロード完了した後にのみ実行されるようにすることができます。

$(function(){ 
    $("#div").on('click', function() { 
     $('#result').load('test.html', function(){ 
      $('.element').plugin(); 
     }); 
     });  
});