17

私は と の使用に慣れている.click()のでdelegate('click')、最近のバージョンの jQuery では両方が非推奨になっていることを読んだときは、それを読んでみようと思いましたが、少し頭を悩ませています。

ドキュメントhereは、これが.live()および.delegate()のドロップイン置換であることを示唆しているようですが、.click()および.bind()は異なる動作をしていました。つまり、現在存在するオブジェクトにバインドし、他のオブジェクトはDOM の存続期間中、セレクター パターンに一致するすべてのオブジェクトにバインドされます。

ほとんどの場合、これは大きな違いにはなりませんが、要素を DOM に動的に追加する場合、これは重要な違いです。古いパターンに一致する新しいオブジェクトは、を使用してイベントに関連付けられたリスナーを持ちませんが、を使用します。click.click().delegate()

私の質問は、.on()メソッドを使用して既存の.delegate()との両方の動作を複製するにはどうすればよい.bind()ですか? それとも、今後はすべて.delegate()スタイルに向かっていくのでしょうか?

4

4 に答える 4

41

どちらのモードも引き続きサポートされます。

への次の呼び出しbind():

$(".foo").bind("click", function() {
    // ...
});

への次の呼び出しに直接変換できますon()。

$(".foo").on("click", function() {
    // ...
});

への次の呼び出しdelegate():

$("#ancestor").delegate(".foo", "click", function() {
    // ...
});

への次の呼び出しに変換できますon()。

$("#ancestor").on("click", ".foo", function() {
    // ...
});

完全を期すために、次の への呼び出しlive():

$(".foo").live("click", function() {
    // ...
});

への次の呼び出しに変換できますon()。

$(document).on("click", ".foo", function() {
    // ...
});

アップデート：

イベントを除いonて、残りのイベントは異なる jQuery バージョンで廃止されました。

  • bind- 非推奨のバージョン: 3.0
  • live- 非推奨のバージョン: 1.7、削除された: 1.9
  • delegate- 非推奨のバージョン: 3.0
于 2012-07-02T15:26:25.927 に答える
5

メソッドは、使用方法に応じて と のon両方bindを置き換えることができます (また、 asはそれを置き換えることもできます)。delegateclickbind

.click(handler) == .on('click', handler)

.bind('click', handler) ==  .on('click', handler)

.delegate('click', '#id', handler) == .on('click', '#id', handler)

またはメソッドのいずれも、clickまだ非推奨のページに到達していません。私はその方法がこれまでにないだろうとは思わない.delegatebindclick

于 2012-07-02T15:27:40.350 に答える
2

ソースコードからエイリアスの使用法を推測できます。

console.log($.fn.delegate);
function (a, b, c, d) {
    return this.on(b, a, c, d);
}

console.log($.fn.bind);
function (a, b, c) {
    return this.on(a, null, b, c);
}

ドキュメントには、使用例も記載されています。

$(elements).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(elements).on(events, selector, data, handler);        // jQuery 1.7+
于 2012-07-02T15:23:17.093 に答える
2

.delegate()とメソッドを.bind()使用しますon。そしてあまりにも.click()ショートカットです。.on()

于 2012-07-02T15:23:30.593 に答える