動的に追加された要素のために jQuery の `live()` を `on()` に正しく移行するにはどうすればよいですか?

jQuery での live() から on() への移行: イベント バインディングのデバッグ

jQuery の live() メソッドはバージョン 1.7 で非推奨になり、on( への切り替えが必要になりました) ）。 live() を on() に置き換えると、理想的には同様の結果が得られるはずですが、on() のドキュメントでは、イベント ハンドラーはバインド時にページ上に存在する現在選択されている要素にのみバインドされることを強調しています。

オリジナル実装 (live()):

$('select[name^="income_type_"]').live('change', function() {
    alert($(this).val());
});

置換(on()):

$('select[name^="income_type_"]').on('change', function() {
    alert($(this).val());
});

live() との不一致は、イベントを添付する live() の委任メカニズムとは異なり、on() が現在存在する要素にのみバインドするという事実に由来します。 DOM に動的に追加される要素へのハンドラー。

動的に対する on() の正しい使用法要素:

on() を使用して動的に追加された要素のイベント処理を維持するには、バインド時にページ上に存在する親要素にイベント ハンドラーをバインドする必要があります。これは、

$(document.body).on('change', 'select[name^="income_type_"]', function() {
    alert($(this).val());
});

を使用することで実現できます。また、イベント委任を要素階層の近くに適用して、特異性を向上させることもできます。

jQuery ドキュメント ヒント:

live() のドキュメントには、後継者に関して live() を書き直すにはバインディング イベントが含まれることが明示的に記載されています既存の要素へのハンドラー:

$(document).on(events, selector, data, handler);  // jQuery 1.7+

以上が動的に追加された要素のために jQuery の `live()` を `on()` に正しく移行するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。