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
- jQuery EasyUI 开源插件套装 完全替代ExtJS
- 深入理解jQuery中live与bind方法的区别
- jQuery中.live()方法的用法深入解析
- 解析jQuery的三种bind/One/Live事件绑定使用方法
- jQuery中bind,live,delegate与one方法的用法及区别解析
- jquery live()调用不存在的解决方法
- jQuery的live()方法对hover事件的处理示例
- jQuery中对未来的元素绑定事件用bind、live or on
- jQuery 1.9使用$.support替代$.browser的使用方法
- jQuery 1.9移除了$.browser可以使用$.support来替代
- jQuery中用dom操作替代正则表达式
- 浅谈被jQuery抛弃的函数及替代函数
- jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解
- jquery ui dialog替代confirm实例分析
相关文章
这篇文章主要介绍了jQuery中map()方法用法,实例分析了map()方法的功能、定义及转换数组的使用技巧,需要的朋友可以参考下2015-01-01
这篇文章主要介绍了jQuery实现折线图的方法,涉及jQuery及相关插件的使用技巧,非常具有实用价值,需要的朋友可以参考下2015-02-02
这篇文章主要介绍了jquery插件corner实现圆角边框的方法,实例分析了jQuery插件corner的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-03-03
这篇文章主要介绍了基于jQuery实现多标签页切换的效果(web前端开发)的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下2016-07-07
大家都知道jQuery很强大，也有很多效果很帅的插件，下面介绍下jQuery定时器插件jQuery Timers，那JS都自带有定时器，为什么要使用Jquery的呢？2010-10-10
貌似AJAX越来越火了，作为一个WEB程序开发者要是不会这个感觉就要落伍，甚至有可能在求职的时候屡被淘汰。我也是一个WEB程序开发者，当然我也要“随波逐流”一把，不然饭碗不保啊！2009-11-11
本篇文章主要介绍了jQuery+CSS3实现点赞功能的示例代码。具有很好的参考价值。下面跟着小编一起来看下吧2017-03-03
jQuery Dialog 打开时自动聚焦的解决方法(两种方法)
这篇文章主要介绍了jQuery Dialog 打开时自动聚焦的解决方法,及jquery dialog打开时，自动聚焦在第一个控件上的方法，对jquery dialog相关知识感兴趣的朋友通过本文一起学习吧2016-11-11
jquery按回车提交数据的代码示例，很简单的一个方法，看一下就明白2013-11-11
这篇文章主要介绍了jQuery中wrapAll()方法用法,实例分析了wrapAll()方法的功能、定义及匹配元素的使用技巧,需要的朋友可以参考下2015-01-01
最新评论