.LOAD後のIDによる要素のjQueryのアクセスは（）

Question

$(document).ready(function() { 
    $("img.tile").click(function() { 
    var actid = $(this).data().id; 
    $("#lz").load("/dialog/pre?actid=" + actid); 
    $("#btnCheck").click(function() { 
     alert("test"); 
    }); 
}); 

を呼び出す負荷（）の呼び出しは<input id="btnCheck" value="Check" /> を持っているHTMLフラグメントをもたらします。しかし、私はそれをクリックしたときにイベントは発生しません。 フラグメントがどのように読み込まれているかに関係している必要があります。この作品をどうやって作っていますか？

Answer 1

最も良い方法は、delegateを使用し、イベントバブルを利用して、まだ存在しない要素のイベントを取得することです。これはコンテキストを提供するために、既存の選択に作業することができ、特にとして、非常に簡単です：

$(document).ready(function() { 
    $("img.tile").click(function() { 
     var actid = $(this).data().id; 
     $("#lz") 
      .load("/dialog/pre?actid=" + actid) 
      .delegate("#btnCheck", "click", function() { 
       alert("test"); 
      }); 
    }); 
}); 

これはload例と機能的に同等であるが、いくつかの点で若干優れた性能を持っています。

Answer 2

データがロードされたことを確認した後、またはliveイベントを使用して添付するには、clickイベントを添付する必要があります。あなたは、データがロードされたことを確認された後

$("#btnCheck").live('click', function() { 
    alert("test"); 
}); 

また、あなたがそれを添付することができます：それは現在または将来の任意の時点でそれを見つけ、実装がおそらく最も簡単である場合liveは、ハンドラをアタッチします。 @bzlmが彼のコメントloadで指摘したように、非同期イベントであるため、後続のコードで終了したとはみなせません。幸いloadがロードされていますが、すべてのデータの後に発火する2番目の引数として関数を渡すことができます：

$("#lz").load("/dialog/pre?actid=" + actid, function() { 
    $("#btnCheck").click(function() { 
     alert("test"); 
    }); 
}); 

Answer 3

試してみてください。

$(document).ready(function() { 
    $("img.tile").click(function() { 
    var actid = $(this).data().id; 
    $("#lz").load("/dialog/pre?actid=" + actid); 
    $("#btnCheck").live('click', function() { 
     alert("test"); 
    }); }); 

この後にDOMに追加された要素をピックアップしますロードイベント。より良い方法が使用されるかもしれない.delegate()