$('#element-id').on()
メソッドの代わりにメソッドを使用する開発者が増えていることがわかり$('#element-id').live()
ます。
なんで?そのlive
メソッドにないものは何ですか?
$('#element-id').on()
メソッドの代わりにメソッドを使用する開発者が増えていることがわかり$('#element-id').live()
ます。
なんで?そのlive
メソッドにないものは何ですか?
にバインドされたイベント ハンドラ.live
は、 にバインドされますdocument
。バインドされたイベント ハンドラー.on
は、指定した要素にバインドされます。つまり、イベントがそれを受け取る要素にバブルアップするのにかかる時間を短縮できることを意味します。また、伝播を停止できることも意味します (.live
すでにドキュメントに到達しているため、 では不可能です)。
この.on
メソッドでは、すべてのイベント ハンドラーに対して 1 つのメソッドを使用することもできます。.live
常にイベント ハンドラーをデリゲートし.on
ますが、セレクターを 2 番目の引数として渡す場合にのみデリゲートします。これがないと、一致した要素のセットにバインドされます。
その他の欠点は、jQuery docsにリストされています。
jQuery は、メソッドを呼び出す前に、セレクターによって指定された要素を取得しようとしますが
.live()
、大きなドキュメントでは時間がかかる場合があります。メソッドの連鎖はサポートされていません。たとえば、
$("a").find(".offsite, .external").live( ... );
は有効ではなく、期待どおりに機能しません。すべての
.live()
イベントはドキュメント要素に関連付けられているため、イベントは処理されるまでに可能な限り長く、最も遅いパスをたどります。モバイル iOS (iPhone、iPad、iPod Touch) では、クリック イベントはほとんどの要素でドキュメントの本文にバブリングせず、
.live()
...イベント ハンドラーでの呼び出し
event.stopPropagation()
は、ドキュメントの下部にアタッチされたイベント ハンドラーを停止するのに効果的ではありません。イベントはすでにドキュメントに伝達されています。この
.live()
メソッドは、驚くべき方法で他のイベント メソッドとやり取りします。たとえば$(document).unbind("click")
、.live()
!
これらすべての理由から、常に.on()
代わりに を使用する必要があり.live()
ます。古いバージョンの jQuery (1.7 未満) に行き詰まっている場合は、.delegate()
代わりに使用できます。
補足- すべてのイベント バインディング メソッドは内部で呼び出されるため、すべてのイベント処理のニーズ.on()
に使用することは理にかなっています。.on()
のようなショートカット メソッドを気にしないでください.click()
。1.7.2 のソースから、次のように呼び出すだけであることがわかり.on
ます。
return arguments.length > 0 ? this.on(name, null, data, fn) : this.trigger(name);
完全な回答: http://www.jquery4u.com/jquery-functions/on-vs-live-review/#.UEXy7NZSskU
短い読み:
.live() メソッドの使用は推奨されなくなりました。jQuery の新しいバージョンでは、欠点のないより優れたメソッドが提供されているためです。特に、.live() を使用すると、次の問題が発生します。
また、.on() 関数は jQuery 1.7 にのみ含まれていたため、以前のバージョンでは機能しないことに注意してください。
まず第一に、live()
メソッドは jQuery 1.7 の時点で非推奨であり、コードでの使用を段階的に廃止する必要があります。このメソッドを使用したチェーンは適切にサポートされていません。
の比較に関する非常に優れた記事があります。jQuery .bind() , .live() , .delegate() , .on()
http://www.elijahmanor.com/2012/02/differences-between-jquery-bind-vs-live.html