jquery には、自動的に追加される DOM オブジェクトをバインドするために使用できるメソッドが 2 つあります。これらは、live メソッドと delegate メソッドです。実際、これら 2 つのメソッドは、固定 DOM オブジェクトを処理する場合、通常、Just binding is を使用します。これだけでも十分ですが、オブジェクトによって動的に生成された DOM オブジェクトの場合は、bind を使用してできることは何もありません (笑)。
live メソッドは、(特定のタイプの) 特定のオブジェクトをバインドし、それらにメソッドをバインドするために使用されます。
次のようにコードをコピーします。
//ライブ
$("td").live("クリック", function () {
アラート($(this).html());
});
//以下も可能 $("#list td").live("click", function () {
アラート($(this).html());
});
デリゲート メソッドは、特定の (特定の種類の) オブジェクトの下にサブオブジェクトをバインドし、そのサブオブジェクトにメソッドをバインドするために使用されます (サブオブジェクトが特定のメソッドを持つようにサブオブジェクトをデリゲートします、笑)
次のようにコードをコピーします。
$("#list").delegate("td", "クリック", function () {
アラート($(this).html());
});
以下のデモの完成したコード:
次のようにコードをコピーします。
<html lang="ja" xmlns="http://www.w3.org/1999/xhtml">
<頭>
<meta charset="utf-8" />
<タイトル></タイトル>
<script src="jquery.js" type="text/javascript"></script>
<script id="listTemplate" type="text/html">
<tr>
<td>[ユーザーID]</td>
<td>[ユーザーイメージ]</td>
<td>[ユーザー名]</td>
</tr>
</script>
<script type="text/javascript">
var reg = new RegExp("//[([^//[//]]*?)//]", 'igm'); //igm は、大文字と小文字を区別する一致とグローバル一致をそれぞれ指定することを指します。複数の行に一致します。 。
$(関数() {
//ライブ
$("#list td").live("click", function () {
アラート($(this).html());
});
$("#addFun").click(function () {
var html = document.getElementById("listTemplate").innerHTML;
var source = html.replace(reg, function (node, key) { return { 'UserImg': '1', 'UserName': 'zhang', 'UserID': '1' }[key]; });
$("#list").append(ソース);
});
});
</script>
</head>
<本文>
<div id="comment_ul_2">
</div>
<input type="button" id="addFun" value="クリックしてください" />
<テーブルid="リスト">
<本体>
</tbody>
</テーブル>
</body>
</html>