回答:
on()jQueryのイベントバインディング関数のほとんどを1つにマージする試みです。これには、livevsによる非効率性を片付けるという追加のボーナスがありdelegateます。jQueryの将来のバージョンでは、これらの方法では削除され、のみonとone残されます。
例：
// Using live()
$(".mySelector").live("click", fn);
// Equivalent `on` (there isn't an exact equivalent, but with good reason)
$(document).on("click", ".mySelector", fn);
// Using bind()
$(".mySelector").bind("click", fn);
// Equivalent `on`
$(".mySelector").on("click", fn);
// Using delegate()
$(document.body).delegate(".mySelector", "click", fn);
// Equivalent `on`
$(document.body).on("click", ".mySelector", fn);
内部的には、jQueryはこれらすべてのメソッドと省略形のイベントハンドラーセッターをメソッドにマッピングしon()、今後はこれらのメソッドを無視して次のように使用する必要があることを示しますon。
bind: function( types, data, fn ) {
return this.on( types, null, data, fn );
},
live: function( types, data, fn ) {
jQuery( this.context ).on( types, this.selector, data, fn );
return this;
},
delegate: function( selector, types, data, fn ) {
return this.on( types, selector, data, fn );
},
https://github.com/jquery/jquery/blob/1.7/src/event.js#L965を参照してください。
$(document.body).delegate("click", ".mySelector", fn);する必要があります$(document.body).delegate(".mySelector", "click", fn);
on自然に非常に近いdelegateです。では、なぜデリゲートを使用しないのですか？それonは一人で来ないからです。ありますoffアンバインドイベントにと、one一度だけ実行されるようにイベントを作成します。これは新しいイベントの「パッケージ」です。
の主な問題liveは、「ウィンドウ」に接続し、ページ構造（dom）の奥の要素にクリックイベント（または他のイベント）を強制し、ページの上部に「バブル」してイベントを見つけることです。それに対処する用意があるハンドラ。各レベルで、すべてのイベントハンドラーをチェックする必要があります。深いインブリケーション（<body><div><div><div><div><table><table><tbody><tr><td><div><div><div><ul><li><button> etc etc etc...）を行うと、これはすぐに加算されます。
だから、bindのようなclick、他のショートカットイベントバインダーのようなイベントターゲットに直接接続します。たとえば、1000行、100列のテーブルがあり、100'000のセルのそれぞれに、処理したいクリックのチェックボックスが含まれているとします。100,000イベントハンドラを取り付けることになりますたくさんのページのロードに時間のを。テーブルレベルで単一のイベントを作成し、イベントの委任を使用すると、数桁効率が向上します。イベントターゲットは、イベント実行時に取得されます。「this」はテーブルにevent.targetなりますが、「this」はclick関数内の通常の「」になります。ここでの良い点onは、「this」が常にイベントターゲットであり、それがアタッチされているコンテナではないということです。
.on方法、行うことは可能である.live、.delegateと.bind同じ機能を持つが、と.live()だけ.live()（文書にイベントを委譲）が可能です。
jQuery("#example").bind( "click", fn ) = jQuery( "#example").on( "click", fn );
jQuery("#example").delegate( ".examples", "click", fn ) = jQuery( "#example" ).on( "click", ".examples", fn )
jQuery("#example").live( fn ) = jQuery( document ).on( "click", "#example", fn )
私はjQueryソースからこれを直接確認できます：
bind: function( types, data, fn ) {
return this.on( types, null, data, fn );
},
live: function( types, data, fn ) {
jQuery( this.context ).on( types, this.selector, data, fn );
return this;
},
delegate: function( selector, types, data, fn ) {
return this.on( types, selector, data, fn );
},
jQuery（this.context）？this.context=== documentほとんどの場合
（質問を変更する前に私の冒頭の文がより意味をなしています。元々は「何が違うのliveですか？」と言っていました。）
on以上のようなものであるdelegateようにそれがあるよりもlive、それは基本的に統一された形だ、bindとdelegate（実際には、チームはその目的があると述べ、「... ...文書にイベントをアタッチするすべての方法を統一します」）。
live基本的にon（またはdelegate）全体としてドキュメントに添付されます。それはだV1.7で廃止使用しての賛成でonかdelegate。今後、or （または）onを使用するのではなく、単独でコードを使用するようになると思います...binddelegatelive
したがって、実際には次のことができます。
次のonように使用bind：
/* Old: */ $(".foo").bind("click", handler);
/* New: */ $(".foo").on("click", handler);
次のonように使用しますdelegate（特定の要素をルートとするイベントの委任）：
/* Old: */ $("#container").delegate(".foo", "click", handler);
/* New: */ $("#container").on("click", ".foo", handler);
次のonように使用しますlive（ドキュメントをルートとするイベントの委任）：
/* Old: */ $(".foo").live("click", handler);
/* New: */ $(document).on("click", ".foo", handler);
onとを組み合わせたものでbind、delegate私が言ったように、とあまり似ていませんlive。あなたは使用することができますonようにbind（要素に直接ハンドラをアタッチ）、またはあなたが使用することができますonようにdelegate（要素にハンドラをアタッチ、実際の要素はマッチにセレクタをクリックした場合にのみ、イベントを発生し、その要素かのように、1つでしたイベントが発生した-たとえば、イベントの委任）、またはlive（delegateドキュメントをルートとして使用して）同様に使用できます。要素を動的に追加する場合に役立つのは、イベントの委任です。
$("#id", ".class").live(fn)= $(".class").delegate("#id", fn );実際、古いjQueryソースでは、一般的なケースとしてライブを使用し、特殊なケースとしてデリゲートを使用していたため、考えてみると、これはさらに混乱します。
delegateすぐに追加したので、それが知られている用途だとは思わないが、それでもなお。:-)
liveは.on（）のショートカットです
//from source http://code.jquery.com/jquery-1.7.js
live: function( types, data, fn ) {
jQuery( this.context ).on( types, this.selector, data, fn );
return this;
}
また、この投稿はあなたに役立つかもしれません http://blog.jquery.com/2011/11/03/jquery-1-7-released/
基本的なユースケースにはありません。これら2つの行は機能的に同じです
$( '#element' ).bind( 'click', handler );
$( '#element' ).on( 'click', handler );
.on（）はイベントの委任も行うことができ、推奨されます。
.bind（）は、実際には.on（）のエイリアスにすぎません。1.7.1のbind関数の定義は次のとおりです
bind: function( types, data, fn ) {
return this.on( types, null, data, fn );
},
.on（）を追加するアイデアは、イベントをバインドするための複数の関数を持つのではなく、統一されたイベントAPIを作成することでした。.on（）は、.bind（）、. live（）および.delegate（）を置き換えます。
要素に関連付けられたイベントハンドラーを取得する場合に注意する必要があるもの-ハンドラーがアタッチされている要素に注意してください！
たとえば、次を使用する場合：
$('.mySelector').bind('click', fn);以下を使用してイベントハンドラーを取得します。
$('.mySelector').data('events');しかし、あなたが使うなら：
$('body').on('click', '.mySelector', fn);以下を使用してイベントハンドラーを取得します。
$('body').data('events');（最後のケースでは、関連するイベントオブジェクトにselector = "。mySelector"が含まれます）
eventsとにかくドキュメント化されておらず、1.9では機能しないと思います