jQuery では、bind、live、または on_jquery を使用して、将来の要素イベントをバインドします。

今後の要素バインディング イベントにはバインドを使用できません。

1. 代わりに live を使用できますが、公式ドキュメントによると、live と delegate は 1.7 以降では推奨されません。 1.9 ライブでは削除される予定です。

2. 代わりに on を使用することをお勧めします (注: バージョン 1.7 以降でのみサポートされます)。使用法: on(events,[selector],[data],fn)

コードをコピー コードは次のとおりです:

//$(function(){})
$(document).on("click", "#testDiv", function(){
に配置された場合にのみ有効です//ここで、$(this) は、$(document)
}) ではなく、$( "#testDiv") を指します。

3. それぞれに特定のイベントのみを生成したい場合一致する要素 ( click など) 1 回限りのイベント処理関数をバインドするときは、 on の代わりに .one() を使用します。これはすべての [selector] に対して 1 回だけ実行されるのではなく、これらの [selects] に対しても 1 回だけ実行されることに注意してください。将来の要素にも有効です。

4. イベントにバインドする必要がある div に追加、削除、または変更の 3 つのボタンがある場合は、次のように記述します:

コードをコピーします コードは次のとおりです。

$('#btn-add').click(function(){}); '#btn-del').click (function(){});
$('#btn-edit').click(function(){});

このように書くと、3 つの構造的接続の違いがわかりません。イベントが発生する理由もありません。

jQuery イベント バインディングに関するいくつかの考え方について、CoffeeDeveloper の推奨事項を見てみましょう。

コードをコピー コードは次のとおりです。

$("#btnContainer").coffee({
click: {
"#btn-add": function(){ //何かをする },
"#btn-del": function(){ //何かをする },
"#btn-edit": function(){ //何かをする }
} ,
Mouseenter:{
"#btn-abc": function(){ //何かをする },
}
});

このように書くと、見た目はかなり良くなったと思いませんか? (.coffee() はカスタム関数です。この関数を自分で書くことはできますか?)、バインドされた関数が比較的長い場合、コードはまだ少し乱雑に感じられます。

コードをコピーします コードは次のとおりです:

$('#btnContainer')

.on ('click','# btn-add', function(){})
.on('click','#btn-del', function(){})
.on('click' ,'#btn-edit' ,function(){});


この書き方では、上記の 2 つの欠点も回避され、見た目も煩雑になりません。