<p> 要素に click イベントハンドラを接続する：
$("p").on("click", function(){
alert("The
paragraph was
clicked.");
});
Try it Yourself »
on() メソッドは、選択した要素と子要素に 1 つ以上のイベントハンドラを接続します。
jQuery version 1.7 時点で、on() メソッドは、bind()、live()、delegate() メソッドに代るものです。 このメソッドは、API に多数の一貫性をもたらすので、jQuery コードベースの簡素化に、このメソッドの使用をお勧めします。
注:on() メソッドを使用して設定したイベントハンドラは、現在および 将来（スクリプトによってこれから作成される新しい）要素の両方で動作します。
チップ: イベントハンドラを削除するには、off() メソッドを使用します。
チップ: 1 度だけ実行するイベントを接続するためには、 one() メソッドを使用します。
$(selector).on(event,childSelector,data,function,map)
| パラメータ | 説明 |
|---|---|
| event | 必須。指定した要素から削除するための 1 つ以上のイベントまたは名前空間を指定する。 複数のイベントはカンマで区切る。妥当なイベントでなければならない。 |
| childSelector | 任意。（非推奨の delegate() のようにセレクタ自身は含まない）指定の子要素にのみ 接続するイベントハンドラを指定する。 |
| data | 任意。関数を通して渡す追加のデータを指定する |
| function | 必須。イベントが発生したときに実行する関数を指定する |
| map | 要素に接続する 1 つ以上のイベント、およびイベントが発生したときに実行するための関数を含む イベントマップ（{event:function, event:function, ...}）を指定する |
bind() から on() への変更
bind() と同じ効果を得るための on() の使用方法。
delegate() から on() への変更
delegate() と同じ効果を得るための on() の使用方法。
live() から on() への変更
live() と同じ効果を得るための on() の使用方法。
複数イベントを接続する
複数イベントを接続する方法。
map パラメータを使用して複数のイベントハンドラを設定する
map パラメータを使用して、選択した要素へ複数のイベントハンドラを設定する方法。
要素にカスタム・イベントを設定する
要素にカスタマイズした名前空間イベントを設定する方法。
関数にデータを渡す
関数にデータを渡す方法。
将来の要素にイベントハンドラを追加する
on() メソッドは、まだ作成されていない要素にも動作することを示す。
イベントハンドラの削除
off() メソッドを使用してイベントハンドラを削除する方法。