使用jQuery刪除事件（或稱解除事件綁定）有三個函數：unbind、die和undelegate。這三個方法都依賴于未公開的jQuery.event.remove（后續使用remove簡寫）。此為刪除事件的核心方法。

?

remove 所作的事情與上一篇提到的.add 剛好相反。且與.add中的處理代碼一一對應，即? .add 中有多少種添加事件的方式remove就有對應的刪除方式。

remove 定義了四個參數 elem, types, handler, pos 。從字面上看四個參數的意義很明了

• elem 為HTMLElement
• types 為String類型，事件名稱如'click'或'mouseover mouseout' ?
• handler 為Function類型，事件回調函數
• pos 為Number類型，指定數組位置

但remove內部沒這么簡單，如

1. handler 有時會傳布爾類型false，這時會把handler賦值為另一個函數（此處的處理同.add）

if ( handler === false ) {handler = returnFalse; }

?

2. types 有時會為一個對象，這時真正的handler是types.handler，types是types.type

// types is actually an event object here if ( types && types.type ) {handler = types.handler;types = types.type; }

我們知道變量命名要具有意義，名副其實而避免誤導。從這個意義上講，jQuery中存在大量這樣的寫法，一個變量往往具有多種含義，晦澀難讀。如這里的types，應該是String類型，但實際內部對typeos為Object類型也做了處理。這是JS沒有類型檢查的原因導致。反過來講這種語言會比較靈活，jQuery才如此 緊湊 ，內聚。

閑言少敘，看看.remove方法都做了哪些事。

當只傳elem時，會將elem上添加的所有事件都刪除。如$('#id').unbind()

當types為String，且以點號（.）開頭時將刪除該命名空間下的事件。如$('#id').unbind('.name')。會把添加click.name，mouseover.name等都刪除

對應的代碼如下

// Unbind all events for the element if ( !types || typeof types === "string" && types.charAt(0) === "." ) {types = types || "";for ( type in events ) {jQuery.event.remove( elem, type + types );}return; }

我們發現for?in中是個遞歸調用。

如果這么調用

jQuery.event.remove(el, 'click', fn)

那么是不會走上面的遞歸的，而是直接進入了while循環

?

while ( (type = types[ i++ ]) ) {...}

這是標準的刪除事件的流程。大概步驟如下

判斷事件名稱是否具有命名空間（以點號區分），如果沒有命名空間則刪除該事件名稱下的所有事件。否則只刪除命名空間的某事件。

取得事件數組（eventType = events[ type ]），如果沒有傳handler則表示刪除該類型事件的所有hanlder，否則只刪除該事件類型的指定handler。

對特殊事件（如live）的處理

最后對elemData進行處理，如果events為空對象則刪除elemData的events和handle屬性。如

// Remove the expando if it's no longer used if ( jQuery.isEmptyObject( events ) ) {var handle = elemData.handle;if ( handle ) {handle.elem = null;}delete elemData.events;delete elemData.handle;if ( jQuery.isEmptyObject( elemData ) ) {jQuery.removeData( elem, undefined, true );} }

jQuery事件管理數據結構圖：

總結

以上是生活随笔為你收集整理的读jQuery之十二（删除事件核心方法）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。