jQuery1.9+中刪除了live以后的替代方法
根據(jù)jQuery的官方描述,live方法在1.7中已經(jīng)不建議使用,在1.9中刪除了這個方法。并建議在以后的代碼中使用on方法來替代。
on方法可以接受三個參數(shù):事件名、觸發(fā)選擇器、事件函數(shù)。
需要特別注意的是:on方法中間的這個觸發(fā)選擇器就是你將要添加的HTML元素的類名、id或者元素名,使用它就可以實(shí)現(xiàn)live的效果。
例如我的html文檔中已經(jīng)有了一個id為parent的div,我將要在這個div內(nèi)部再動態(tài)添加一個class為son的span,然后我為這個span綁定一個事件,那么我需要這樣寫:
$('#parent').on('click','.son',function(){alert('test')});
這個觸發(fā)選擇器實(shí)際上就是在 JQ內(nèi)部判斷了一次事件參數(shù)的$(e.target).is(selector),只有觸發(fā)對象匹配觸發(fā)選擇器才會觸發(fā)。這是利用了事件冒泡的機(jī)制來完成 的,原本的live也是使用冒泡機(jī)制所以既然on可以實(shí)現(xiàn)那么live也就沒有存在的必要了,只不過為了兼容讓它從1.7茍延殘喘的活到了1.9而已。
這篇文章也沒啥內(nèi)容了,接下來就用這個功能做點(diǎn)有意義的事情示范下吧~ 在低版本IE中A標(biāo)簽在鼠標(biāo)按下時候會出現(xiàn)虛線邊框,這是由focus造成的。我們只要在全局事件中做點(diǎn)手腳就能解決這個問題。在現(xiàn)代瀏覽器中focus是不冒泡的,但是低版本瀏覽器中可以冒泡。所以對于低版本瀏覽器中對focus使用live是有效的。在jQuery1.9之前的版本我們可以這樣寫:
$("a").live("focus",function(){
this.blur();
});
jQuery1.9之后由于live被刪除了,所以應(yīng)該這樣寫:
$(document).on("focus","a",function(){
this.blur();
});
還要注意個問題,如果是從live的寫法換成on的寫法別忘了調(diào)整調(diào)用鏈。因?yàn)閘ive的返回值是事件觸發(fā)的對象,而使用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
- jQuery EasyUI 開源插件套裝 完全替代ExtJS
- 深入理解jQuery中l(wèi)ive與bind方法的區(qū)別
- jQuery中.live()方法的用法深入解析
- 解析jQuery的三種bind/One/Live事件綁定使用方法
- jQuery中bind,live,delegate與one方法的用法及區(qū)別解析
- jquery live()調(diào)用不存在的解決方法
- jQuery的live()方法對hover事件的處理示例
- jQuery中對未來的元素綁定事件用bind、live or on
- jQuery 1.9使用$.support替代$.browser的使用方法
- jQuery 1.9移除了$.browser可以使用$.support來替代
- jQuery中用dom操作替代正則表達(dá)式
- 淺談被jQuery拋棄的函數(shù)及替代函數(shù)
- jQuery中bind(),live(),delegate(),on()綁定事件方法實(shí)例詳解
- jquery ui dialog替代confirm實(shí)例分析
相關(guān)文章
jquery插件corner實(shí)現(xiàn)圓角邊框的方法
這篇文章主要介紹了jquery插件corner實(shí)現(xiàn)圓角邊框的方法,實(shí)例分析了jQuery插件corner的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-03-03
基于jQuery實(shí)現(xiàn)多標(biāo)簽頁切換的效果(web前端開發(fā))
這篇文章主要介紹了基于jQuery實(shí)現(xiàn)多標(biāo)簽頁切換的效果(web前端開發(fā))的相關(guān)資料,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2016-07-07
jquery ajax提交表單數(shù)據(jù)的兩種方式
貌似AJAX越來越火了,作為一個WEB程序開發(fā)者要是不會這個感覺就要落伍,甚至有可能在求職的時候?qū)冶惶蕴?。我也是一個WEB程序開發(fā)者,當(dāng)然我也要“隨波逐流”一把,不然飯碗不保?。?2009-11-11
jQuery+CSS3實(shí)現(xiàn)點(diǎn)贊功能
本篇文章主要介紹了jQuery+CSS3實(shí)現(xiàn)點(diǎn)贊功能的示例代碼。具有很好的參考價值。下面跟著小編一起來看下吧2017-03-03
jQuery Dialog 打開時自動聚焦的解決方法(兩種方法)
這篇文章主要介紹了jQuery Dialog 打開時自動聚焦的解決方法,及jquery dialog打開時,自動聚焦在第一個控件上的方法,對jquery dialog相關(guān)知識感興趣的朋友通過本文一起學(xué)習(xí)吧2016-11-11

