jQuery升级踩坑之路

2022-12-15 11:36:36 浏览数 (1)

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

jQuery 从 1.9 版开始,移除了 .browser 和 .browser.version , 取而代之的是

代码语言:javascript复制
<!--[if lt IE 9]>
    <script src='jquery-1.9.0.js'></script>
<![endif]-->
<!--[if gte IE 9]>
    <script src='jquery-2.0.0.js'></script>
<![endif]-->

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

代码语言:javascript复制
$.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:

代码语言:javascript复制
// Old
if ($.browser.msie && 7 > $.browser.version) {}
// New
if ('undefined' == typeof(document.body.style.maxHeight)) {}

检查是否为 IE 6-8:

代码语言:javascript复制
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方法的错误使用

正确的使用方法:

代码语言:javascript复制
$('input').val(); //获取input表单现在所输入的值
$('input').val('helloworld'); //设置input表单输入的值

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

本文采用 「CC BY-NC-SA 4.0」创作共享协议,转载请标注以下信息:

原文出处:Yiiven https://cloud.tencent.com/developer/article/2193074

0 人点赞