1. on()的多事件綁定
之前學的鼠標事件，表單事件與鍵盤事件都有個特點，就是直接給元素綁定一個處理函數，所有這類事件都是屬於快捷處理。翻開源碼其實可以看到，所有的快捷事件在底層的處理都是通過一個"on"方法來實現的。jQuery on()方法是官方推薦的綁定事件的一個方法。
基本用法：.on( events ,[ selector ] ,[ data ] )
最常見的給元素綁定一個點擊事件，對比一下快捷方式與on方式的不同：
$("#elem").click(function(){}) //快捷方式
$("#elem").on('click',function(){}) //on方式
最大的不同點就是on是可以自定義事件名。
多個事件綁定同一個函數
$("#elem").on("mouseovermouseout",function(){ });
通過空格分離，傳遞不同的事件名，可以同時綁定多個事件。
多個事件綁定不同函數
$("#elem").on({
mouseover:function(){},
mouseout:function(){},
});
通過空格分離，傳遞不同的事件名，可以同時綁定多個事件，每一個事件執行自己的回調方法。
將數據傳遞到處理程序
function greet( event ) {
alert( "Hello " +event.data.name ); //Hello 慕課網
}
$( "button" ).on( "click", {
name: "慕課網"
}, greet );
可以通過第二參數（對象），當一個事件被觸發時，要傳遞給事件處理函數的。
2. on()的高級用法
針對自己處理機制中，不僅有on方法，還有根據on演變出來的live方法，delegate方法等等。這些方法的底層實現部分還是on方法，這是利用了on的另一個事件機制委託的機制衍變而來的。
委託機制
.on( events ,[selector ] ,[ data ], handler(eventObject) )
在on的第二參數中提供了一個selector選擇器，簡單的來描述下。
參考下面3層結構：
<div class="left">
<pclass="aaron">
<a>目標節點</a>//點擊在這個元素上
</p>
</div>
給出如下代碼：
$("div").on("click","p",fn)
事件綁定在最上層div元素上，當用戶觸發在a元素上，事件將往上冒泡，一直會冒泡到div元素上。如果提供了第二參數，那麼事件在往上冒泡的過程中遇到了選擇器匹配的元素，將會觸發事件回調函數。
3. 卸載事件off()方法
（1）通過.on()綁定的事件處理程序
（2）通過off() 方法移除該綁定
根據on綁定事件的一些特性，off方法也可以通過相應的傳遞組合的事件名，名字空間，選擇器或處理函數來移除綁定在元素上指定的事件處理函數。當有多個過濾參數時，只有與這些參數完全匹配的事件處理函數纔會被移除。
綁定2個事件
$("elem").on("mousedownmouseup",fn)
刪除一個事件
$("elem").off("mousedown")
刪除所有事件
$("elem").off("mousedownmouseup")
快捷方式刪除所有事件，這裏不需要傳遞事件名了，節點上綁定的所有事件講全部銷燬
$("elem").off()
附：以上內容整理自慕課網
