現在、クリックが発生したときに何かをする必要があるときにjQueryを使用して、次のようにします...
$(".close-box").click( function() {
MoneyBox.closeBox();
return false;
});
私は他の誰かがプロジェクトに持っているいくつかのコードを見ていました、そして彼らはこのようにそれをします...
$(".close-box").live("click", function () {
MoneyBox.closeBox();
return false;
});
現在非推奨になっているlive（）関数を使用していることを除いて、私が知る限り同じことをしているように見え、jQueryドキュメントはon()代わりに使用すると言っていますが、どちらの方法でも、最初の例の代わりにlive / on（）を使用するのはなぜですか？
回答:
動的に生成された要素（たとえば、AJAX呼び出しからの要素）がある可能性があるため、以前は同じ要素セレクターにバインドされていた同じクリックハンドラーが必要な場合があります。次にon()、セレクター引数を使用してクリックイベントを「委任」します。
実証するために：
on()click()セレクターが指定されていない場合は、次のように同義語にすることもできます。
$('.elementClass').click(function() { // code
});
と同義です
$('.elementClass').on('click', function() { // code
});
クラスを持つすべての要素にハンドラーを1回だけ追加するという意味でelementClass。あなたは新しいしている場合elementClass、たとえば、から来て$('<div class="elementClass" />')、ハンドラがその新しい要素に拘束されることはありません、あなたは何をする必要があります。
$('#container').on('click', '.elementClass', function() { // code
});
#containerが.elementClassの祖先であると仮定する
たくさんの答えがあり、それぞれがいくつかの点に触れています-うまくいけば、これはあなたにあなたの答えを与え、それが何であり、それをどのように使うかについての良い説明があります。
使用click()はのエイリアスbind('click' ...)です。を使用bind()すると、イベントリスナーが設定されているときにDOMがそのまま使用され、DOM内の一致する各要素に関数がバインドされます。つまり、使用する$('a').click(...)場合は、コードの実行時に見つかったDOM内のすべてのアンカータグのクリックイベントに提供される関数をバインドします。
使用live()はjQueryの古い方法でした。これは、イベントをバインドするために使用されましbind()たが、コードの実行時にそれらをDOM内の要素にバインドするだけでなく、DOMの変更をリッスンし、将来一致する要素にもイベントをバインドします。これは、DOM操作を行っていて、後でDOMに削除/更新/追加される可能性があるが、DOMが最初にロードされたときには存在しないいくつかの要素にイベントが存在する必要がある場合に役立ちます。
理由live()、それは不完全に実装されたため、今で償却されています。を使用するにはlive()、最初にDOMで少なくとも1つの要素を選択できる必要がありました（私は信じています）。また、実行中の関数のコピーが各要素にバインドされるようになりました。1000個の要素がある場合は、コピーされた関数がたくさんあります。
on()関数の作成は、これらの問題を克服することでした。単一のイベントリスナーをDOMで変更されないオブジェクトにバインドし（したがってon()、後でDOMに削除/追加される要素で使用することはできません-親オブジェクトにバインドします）、単に適用することができます要素「フィルター」。これにより、セレクターに一致する要素にバブルアップされた場合にのみ関数が実行されます。これは、単一の要素にバインドされた（コピーの束ではなく）存在する関数が1つしかないことを意味します。これは、DOMに「ライブ」イベントを追加するためのはるかに優れたアプローチです。
...そしてそれが違いであり、各機能が存在する理由live()と減価償却される理由です。
$("a").live()-><a>これが呼び出された後に作成された場合でも、すべてに適用されます。$("a").click()-><a>これが呼び出される前のすべてにのみ適用されます。（これはのショートカットでbind()ありon()、1.7では）$("a").on()->イベントハンドラーのアタッチに必要なすべての機能を提供します。（jQuery 1.7の最新版）引用：
jQuery 1.7以降、.live（）メソッドは非推奨になりました。.on（）を使用して、イベントハンドラーをアタッチします。古いバージョンのjQueryのユーザーは、.live（）ではなく.delegate（）を使用する必要があります。
このメソッドは、委任されたイベントハンドラーをページのドキュメント要素にアタッチする手段を提供します。これにより、コンテンツがページに動的に追加されるときのイベントハンドラーの使用が簡素化されます。詳細については、.on（）メソッドの直接イベントと委任イベントの説明を参照してください。
.on（）メソッドは、jQueryオブジェクトで現在選択されている要素のセットにイベントハンドラーをアタッチします。jQuery 1.7以降、.on（）メソッドは、イベントハンドラーのアタッチに必要なすべての機能を提供します。
以前のバージョンでは、.bind（）メソッドを使用して、イベントハンドラーを要素に直接アタッチしていました。
click()の非委任メソッドへのショートカットですon()。そう：
$(".close-box").click() === $(".close-box").on('click')
でイベントを委任するにはon()、つまり。動的に作成されたオブジェクトでは、次のことができます。
$(document).on('click', '.close-box') // Same as $('.close-box').live()
ただし、on()静的要素に委任を導入するのは、それだけdocumentでlive()はありません。
$("#closestStaticElement").on('click', '.close-box')
との違いlivebindをよく読んでください。
一言で言えば、liveイベント委任を使用して、現在および将来存在する要素にバインドできるようにします。
対照的に、を介してアタッチされたハンドラーbind（およびそのショートカットなどclick）は、セレクターに一致するDOM要素にハンドラーを直接アタッチするため、現在存在する要素にのみバインドされます。
liveの柔軟性の結果、パフォーマンスが低下するため、提供する機能が必要な場合にのみ使用してください。
$el.click(fn) のショートカットです $el.on('click', fn)
詳細については、http：//api.jquery.com/click/およびhttp://api.jquery.com/on/を参照してください。
一部のイベントハンドラーをバインドする必要があるdynamically added elements場合は、使用するlive（非推奨）か、機能さonせる必要があります。単純に$('element').click(...);DOMへの任意の動的に追加された要素では動作しません。
この.on()メソッドは、jQueryオブジェクトで現在選択されている要素のセットにイベントハンドラーをアタッチします。このclick()メソッドは、イベントハンドラーを「クリック」JavaScriptイベントにバインドするか、要素でそのイベントをトリガーします。
プレーン.click(...では、セレクターのターゲットがオンザフライで変更された場合（たとえば、いくつかのajax応答を介して）、動作を再度割り当てる必要があります。
これ.on(...は非常に新しく（jQuery 1.7）、委任されたイベントを使用してライブシナリオをカバーできます。これは、とにかく動作をアタッチするためのより高速な方法です。
onのclickためにclickどのようなことがないことである動詞、アクション、好きなように関数名の音ではない（あなたも同じで何ができるように要素をクリックするclick機能）