jQuery 的 live() 被 Deprecate 了

在 jQuery 1.7,live() 方法被標示為 deprecate (不建議使用),意思就是不建議新的專案使用這個方法,另外下個版本的 jQuery 可能會拿掉這個方法,到時候如果要升級 jQuery 的話有用到就要改寫。jQuery 建議的寫法是用 1.4.2 之後就存在的 delegate() 或是 1.7 提供的 on()

on() 統合了 bind()live()delegate() 等方法,用這個方法可以取代前述方法的功能。不過這就好玩了:如果 on() 可以取代 bind()live(),原本的程式碼應該要分別怎麼改寫?

看了半天文件才得到下面的結論:

// 舊
$('#myid').bind(event, fn);
// 新 (改名字就好)
$('#myid').on(event, fn);

// 舊
$('#not_in_dom_yet').live(event, fn)
// 新
$(document).on(event, '#not_in_dom_yet', fn);

另外也是寫下來之後才發現之前 live() 語法的問題:

  1. live() 的原理是把事件綁在上層的元素,事件 bubble 上去之後再去檢查從下面上來的事件是不是符合之前設定的 selector。這個原理在 on()(或是 delegate())才會被暴露出來(有發現那個 document 嗎?)。如果只寫 live() 的話等於是不求甚解的用法,最明顯的問題是無法掌握事件觸發的順序,常常在 bind() 裡面有用的 ev.stopPropagation() 改成 live() 就沒用了。
  2. live() 把事件掛在 document,雖然比每個元素都 bind() 有效率,但是還是要過濾很多傳上來的無關事件。用 delegate() 或是 on() 才能指定要把事件 bind 在哪裡。
  3. live() 的語法不合邏輯。一個用 $('#not_in_dom_yet') 選元素的 jQuery 物件,裡面明明就沒有 DOM 元素,那照理說後面接上的方法都不應該做任何事情。結果 live() 反而是這樣運作的。

所以,就如 jQuery blog 所說的,這的確是一個瘦身計畫:只提供一個簡單的 API 來處理所有事情可以簡化程式碼的設計,也可以幫大家腦袋裡存的文件瘦身。那篇文章,還有 1.7 新功能的介紹,建議大家有空可以看看。

3 thoughts on “jQuery 的 live() 被 Deprecate 了

  1. 其實現在 1.7 的 bind, live, delegate 都是用 on 來實作的,你可以看 source code 就知道現在的 API 要怎樣正確對應到 on 了:P

Leave a Reply

Your email address will not be published. Required fields are marked *