on()、live()、delegate()、bind()的比較

bind(type,[data],fn) 為每個比對元素的特定事件綁定事件處理函數(隻對靜态有效)。

$("a").bind("click",function(){alert("ok");});      

live(type,[data],fn) 給所有比對的元素附加一個事件處理函數，即使這個元素是以後再添加進來的

$("a").live("click",function(){alert("ok");});      

delegate(selector,[type],[data],fn) 指定的元素（屬于被選元素的子元素）添加一個或多個事件處理程式，并規定當這些事件發生時運作的函數。使用 delegate() 方法的事件處理程式适用于目前或未來的元素（比如由腳本建立的新元素）。

當點選滑鼠時，隐藏或顯示 p 元素：

HTML 代碼:

1 <div style="background-color:red">
2 <p>這是一個段落。</p>
3 <button>請點選這裡</button>
4 </div>      

jQuery 代碼:

1 <div style="background-color:red">
2 <p>這是一個段落。</p>
3 <button>請點選這裡</button>
4 </div>      

描述: delegate這個方法可作為live()方法的替代，使得每次事件綁定到特定的DOM元素。

以下兩段代碼是等同的:

 1 $("table").delegate("td", "hover", function(){  $(this).toggleClass("hover");  });       

1 $("table").each(function(){
2     $("td", this).live("hover", function(){
3           $(this).toggleClass("hover");
4     });
5     
6 });      

on(events,[selector],[data],fn) 在選擇元素上綁定一個或多個事件的事件處理函數。on()方法綁定事件處理程式到目前標明的jQuery對象中的元素

jQuery使用on()綁定動态生成元素的事件無效的問題

jQuery的on()方法可以綁定動态生成元素的事件，但是在實際使用時發現無效。如下HTML：

1 <p>
2 <a>123</a>
3 </p>      

使用如下方式，對靜态元素有效，但是綁定動态生成的a元素的事件時無效：

 $('a').on('mouseenter',  function(){  ............}); 

需要綁定a的父級元素（此元素必須為靜态元素，不是後來動态生成的），然後設定on()方法的selector參數才行：

 $('p').on('mouseenter', 'a', function(){ ..............}); 

差别：

.bind()是直接綁定在元素上

.live()則是通過冒泡的方式來綁定到元素上的。更适合清單類型的，綁定到document DOM節點上。和.bind()的優勢是支援動态資料。

.delegate()則是更精确的小範圍使用事件代理，性能優于.live()

.on()則是最新的1.7版本整合了之前的三種方式的新事件綁定機制

type: 含有一個或多個事件類型的字元串，由空格分隔多個事件。比如"click"或"submit"，還可以是自定義事件名。

events:一個或多個用空格分隔的事件類型和可選的命名空間，如"click"或"keydown.myPlugin" 。

selector:一個選擇器字元串用于過濾器的觸發事件的選擇器元素的後代。如果選擇的< null或省略，當它到達標明的元素，事件總是觸發。

data:當一個事件被觸發時要傳遞event.data給事件處理函數。

fn:該事件被觸發時執行的函數。 false 值也可以做一個函數的簡寫，傳回false。