首页 > 代码库 > jQuery升级踩坑之路

jQuery升级踩坑之路

  • 1.使用了被废弃的jQuery.browser属性

jQuery 从 1.9 版开始,移除了 $.browser 和 $.browser.version , 取而代之的是 $.support 。 在更新的 2.0 版本中,将不再支持 IE 6/7/8。 以后,如果用户需要支持 IE 6/7/8,只能使用 jQuery 1.9。 如果要全面支持 IE,并混合使用 jQuery 1.9 和 2.0, 官方的解决方案是:

 

<!--[if lt IE 9]>
    <script src=http://www.mamicode.com/‘jquery-1.9.0.js‘></script>>-->
<!--[if gte IE 9]>
    <script src=http://www.mamicode.com/‘jquery-2.0.0.js‘></script>>-->

 

 

 

在前端开发中我们经常要根据不同的浏览器版本做出不同的处理,jQuery.browser本来是通过浏览器的userAgent字段来提取浏览器相关信息的。新版本中已经将其废弃,而是建议使用特征检测的方法去判断,并且给了一个Modernizr库作为推荐。不过,改成这个库可能改动成本有点大,如果你还是想沿用jQuery.browser的思路的话,可以自己去实现一下它。例如:

 

$.browser.mozilla = /firefox/.test(navigator.userAgent.toLowerCase());
$.browser.webkit = /webkit/.test(navigator.userAgent.toLowerCase());
$.browser.opera = /opera/.test(navigator.userAgent.toLowerCase());
$.browser.msie = /msie/.test(navigator.userAgent.toLowerCase());

 

等号后面的表达式返回的就是 true/false, 可以直接用来替换原来的 $.browser.msie 等。

检查是否为IE6:

// Old
if ($.browser.msie && 7 > $.browser.version) {}
// New
if (‘undefined‘ == typeof(document.body.style.maxHeight)) {}

检查是否为 IE 6-8:

if (!$.support.leadingWhitespace) {}
  • 2.使用了已废弃的live()方法

解决方法:使用on()方法,$(selector).on(event,childSelector,data,function,map)

参数 描述
event 必需。规定要从被选元素移除的一个或多个事件或命名空间。

由空格分隔多个事件值。必须是有效的事件。
childSelector 可选。规定只能添加到指定的子元素上的事件处理程序(且不是选择器本身,比如已废弃的 delegate() 方法)。
data 可选。规定传递到函数的额外数据。
function 可选。规定当事件发生时运行的函数。
map 规定事件映射 ({event:function, event:function, ...}),包含要添加到元素的一个或多个事件,以及当事件发生时运行的函数。

 

 

 

 

 

 

 

 

 

 

 

  •  3.jQuery.fn.attr方法的错误使用

正确的使用方法:

$(‘input‘).val(); //获取input表单现在所输入的值
$(‘input‘).val(‘helloworld‘); //设置input表单输入的值

 

遇到一个更新一个吧,记录一下踩坑历史

jQuery升级踩坑之路