jQuery1.9+中刪除了live之後的替代方法

根據jQuery的官方描述，live方法在1.7中已經不建議使用，在1.9中刪除了這個方法。並建議在之後的代碼中使用on方法來替代。

on方法能夠接受三個參數：事件名、觸發選擇器、事件函數。

須要特別注意的是：on方法中間的這個觸發選擇器就是你將要添加的HTML元素的類名、id或者元素名，使用它就能夠實現live的效果。

例如個人html文檔中已經有了一個id爲parent的div，我將要在這個div內部再動態添加一個class爲son的span，而後我爲這個span綁定一個事件，那麼我須要這樣寫：

$('#parent').on('click','.son',function(){alert('test')});

這個觸發選擇器實際上就是在 JQ內部判斷了一次事件參數的$(e.target).is(selector)，只有觸發對象匹配觸發選擇器纔會觸發。這是利用了事件冒泡的機制來完成 的，本來的live也是使用冒泡機制因此既然on能夠實現那麼live也就沒有存在的必要了，只不過爲了兼容讓它從1.7苟延殘喘的活到了1.9而已。

這篇文章也沒啥內容了，接下來就用這個功能作點有意義的事情示範下吧～ 在低版本IE中A標籤在鼠標按下時候會出現虛線邊框，這是由focus形成的。咱們只要在全局事件中作點手腳就能解決這個問題。在現代瀏覽器中focus是不冒泡的，可是低版本瀏覽器中能夠冒泡。因此對於低版本瀏覽器中對focus使用live是有效的。在jQuery1.9以前的版本咱們能夠這樣寫：

$("a").live("focus",function(){
  this.blur();
});

jQuery1.9以後因爲live被刪除了，因此應該這樣寫：

$(document).on("focus","a",function(){
  this.blur();
});

還要注意個問題，若是是從live的寫法換成on的寫法別忘了調整調用鏈。由於live的返回值是事件觸發的對象，而使用on則是在容器對象上。

//jQuery1.9-
$("#panel").find("div").live("click",function(){
  alert("x");
}).addClass("x");
 
//jQuery1.9+
$("#panel").on("click","div",function(){
  alert("x");
}).find("div").addClass("x"); 　　

注意最後的find("div")，其它就沒什麼問題了。下面是官方說明

http://jquery.com/upgrade-guide/1.9/#live-removed