采用事件委托最直觀的感受就是，不需要給每一個(gè)指定的元素綁定事件，從而降低了繁瑣的綁定過程，節(jié)約了代碼量，同時(shí)也節(jié)約了內(nèi)存的開銷。綁定一個(gè)事件都是需要占用內(nèi)存消耗的，除了性能的差異，通過委托的事件還能很友好的支持動(dòng)態(tài)綁定，只要 on 的 delegate 對(duì)象是 HTML 頁面原有的元素，由于是事件的觸發(fā)是通過 Javascript 的事件冒泡機(jī)制來監(jiān)測(cè)，所以對(duì)于所有子元素（包括后期通過 JS 生成的元素）所有的事件監(jiān)測(cè)均能有效，且由于不用對(duì)多個(gè)元素進(jìn)行事件綁定，能夠有效的節(jié)省內(nèi)存的損耗。

那么 jQuery 對(duì)事件的綁定分別有幾種 API，具體有什么區(qū)別我們來了解一下：

bind方法

.bind()方法用于直接附加一個(gè)事件處理程序到元素上，處理程序附加到 jQuery 對(duì)象中當(dāng)前選中的元素，所以在 .bind() 綁定事件的時(shí)候這些元素必須已經(jīng)存在，很明顯就是直接調(diào)用沒利用委托機(jī)制。

live方法

將委托的事件處理程序附加到一個(gè)頁面的 document 元素，從而簡(jiǎn)化了在頁面上動(dòng)態(tài)添加的內(nèi)容上事件處理的使用。

例如：

$('a').live('click', function() { alert("!")})

JQuery 把 alert 函數(shù)綁定到 $(document) 元素上，并使用 ’click’和 ’a’作為參數(shù)。任何時(shí)候只要有事件冒泡到 document 節(jié)點(diǎn)上，它就查看該事件是否是一個(gè) click 事件，以及該事件的目標(biāo)元素與’a’這一CSS 選擇器是否匹配，如果都是的話，則執(zhí)行函數(shù)。

因?yàn)楦甙姹镜?jQuery 提供了更好的方法，沒有 .live() 方法的缺點(diǎn)，所以 .live() 方法不再推薦使用，特別是使用 .live() 出現(xiàn)的以下問題：

1. 在調(diào)用 .live() 方法之前，jQuery 會(huì)先獲取與指定的選擇器匹配的元素，這一點(diǎn)對(duì)于大型文檔來說是很花費(fèi)時(shí)間的。
2. 不支持鏈?zhǔn)綄懛?。例如?("a").find(".offsite, .external").live( ... ); 這樣的寫法是不合法的，并不能像期待的那樣起作用。
3. 由于所有的 .live() 事件被添加到 document 元素上，所以在事件被處理之前，可能會(huì)通過最長(zhǎng)最慢的那條路徑之后才能被觸發(fā)。
4. 在移動(dòng) iOS (iPhone, iPad 和 iPod Touch) 上，對(duì)于大多數(shù)元素而言，click 事件不會(huì)冒泡到文檔 body 上，并且如果不滿足如下情況之一，就不能和 .live() 方法一起使用：使用原生的可被點(diǎn)擊的元素，例如, a 或 button，因?yàn)檫@兩個(gè)元素可以冒泡到 document。
5. 在 document.body 內(nèi)的元素使用 .on() 或 .delegate() 進(jìn)行綁定，因?yàn)橐苿?dòng) iOS 只有在 body 內(nèi)才能進(jìn)行冒泡。
6. 需要 click 冒泡到元素上才能應(yīng)用的 CSS 樣式 cursor:pointer (或者是父元素包含document.documentElement)。但是依然需要注意的是，這樣會(huì)禁止元素上的復(fù)制/粘貼功能，并且當(dāng)點(diǎn)擊元素時(shí)，會(huì)導(dǎo)致該元素被高亮顯示。
7. 在事件處理中調(diào)用 event.stopPropagation() 來阻止事件處理被添加到 document 之后的節(jié)點(diǎn)中，是效率很低的，因?yàn)槭录呀?jīng)被傳播到 document 上。
8. .live() 方法與其它事件方法的相互影響是會(huì)令人感到驚訝的。例如，$(document).unbind("click") 會(huì)移除所有通過 .live() 添加的 click 事件!
    

delegate方法

為了突破單一 .bind() 方法的局限性，實(shí)現(xiàn)事件委托，jQuery 1.3引入了.live()方法。后來，為解決“事件傳播鏈”過長(zhǎng)的問題，jQuery 1.4又支持為 .live() 方法指定上下文對(duì)象。而為了解決無謂生成元素集合的問題，jQuery 1.4.2干脆直接引入了一個(gè)新方法 .delegate()

使用 .delegate()，前面的例子可以這樣寫：

$('#element).delegate('a', 'click', function() { alert("!!!") });

jQuery 掃描文檔查找(‘#element’)，并使用 click 事件和’a’這一CSS選擇器作為參數(shù)把 alert 函數(shù)綁定到(‘#element)上。

任何時(shí)候只要有事件冒泡到$(‘#element)上，它就查看該事件是否是click事件，以及該事件的目標(biāo)元素是否與CCS選擇器相匹配。如果兩種檢查的結(jié)果都為真的話，它就執(zhí)行函數(shù)。

可以注意到，這一過程與.live()類似，但是其把處理程序綁定到具體的元素而非document這一根上。

那么 (′a′).live()==(document).delegate('a') ？

可見，.delegate() 方法是一個(gè)相對(duì)完美的解決方案。但在DOM結(jié)構(gòu)簡(jiǎn)單的情況下，也可以使用.live()。

on方法

其實(shí) .bind(), .live(), .delegate()都是通過.on()來實(shí)現(xiàn)的，.unbind(), .die(), .undelegate()也是一樣的都是通過.off()來實(shí)現(xiàn)的，提供了一種統(tǒng)一綁定事件的方法。

總結(jié)：

在下列情況下，應(yīng)該使用 .live()或 .delegate()，而不能使用 .bind()：

1. 為DOM中的很多元素綁定相同事件；
2. 為DOM中尚不存在的元素綁定事件；
3. 用.bind()的代價(jià)是非常大的，它會(huì)把相同的一個(gè)事件處理程序hook到所有匹配的DOM元素上
4. 不要再用.live()了，它已經(jīng)不再被推薦了，而且還有許多問題
5. .delegate()會(huì)提供很好的方法來提高效率，同時(shí)我們可以添加一事件處理方法到動(dòng)態(tài)添加的元素上

我們可以用 .on() 來代替上述的 3 種方法。

不足點(diǎn)也是有的：

1. 并非所有的事件都能冒泡，如load, change, submit, focus, blur
2. 加大管理復(fù)雜
3. 不好模擬用戶觸發(fā)事件
4. 如何取舍就看項(xiàng)目實(shí)際中運(yùn)用了