jQuery 3.0中存在问题及解决办法


Posted in Javascript onJuly 15, 2016

jQuery 前阶段推出了3.0版本,改动非常大,如果要使用 3.0 的话,建议先仔细了解一下新特性,否则会引起一些小问题,例如下面的代码。

大家对jQuery 3.0十大新特性不了解的朋友可以参考下本篇文章。

<html>
<head>
<meta charset="utf-8">
<script src="jquery-3.0.min.js"></script>
<script>
$(function (){
$('#container').html('你好');
})
</script>
</head>
<body>
<div id="container"></div>
</body>
</html>

非常简单,此时没有任何问题,可以正常显示内容,但如果 $(function (){... }) 内部出现异常,让人困扰的问题便来了

添加一个异常后的状态

$(function (){
throw new Error('出错了');
$('#container').html('你好');
});

jQuery 3.0中存在问题及解决办法

页面不显示内容是正常的,但控制台也没有显示任何错误信息,显然和我们的预期不一样

因为在使用 jquery 2 时,这种情况下,控制台是可以提示错误的

<script src="jquery-2.1.3.min.js"></script>
<script>
$(function (){
throw new Error('出错了');
$('#container').html('你好');
});
</script>

jQuery 3.0中存在问题及解决办法

解决办法

因为 jquery 3.0 正式支持了 promise,所以可以对 .ready() 使用 promise 形式,使用 fail 抛出异常

例如

$.ready.then (function() {
throw new Error('出错了');
$('#container').html('你好');
}).fail (function(error) {
throw error;
});

这时控制台就可以显示出错误信息了

Javascript 相关文章推荐
javascript 新浪背投广告实现代码
Jul 07 Javascript
JavaScript Event学习第四章 传统的事件注册模型
Feb 07 Javascript
基于Jquery的跨域传输数据(JSONP)
Mar 10 Javascript
文本框文本自动补全效果示例分享
Jan 19 Javascript
超级简单的jquery操作表格方法
Dec 15 Javascript
JavaScript对象属性检查、增加、删除、访问操作实例
Jul 08 Javascript
js面向对象的写法
Feb 19 Javascript
jQuery插件实现图片轮播特效
Jun 16 Javascript
JavaScript设计模式之构造函数模式实例教程
Jul 02 Javascript
在Vue组件中获取全局的点击事件方法
Sep 06 Javascript
Vue点击切换颜色的方法
Sep 13 Javascript
vue resource发送请求的几种方式
Sep 30 Javascript
JavaScript6 let 新语法优势介绍
Jul 15 #Javascript
简单实现轮播图效果的实例
Jul 15 #Javascript
浅谈javascript运算符——条件,逗号,赋值,()和void运算符
Jul 15 #Javascript
JavaScript计算器网页版实现代码分享
Jul 15 #Javascript
js实现楼层效果的简单实例
Jul 15 #Javascript
基于JavaScript实现轮播图代码
Jul 14 #Javascript
js轮播图代码分享
Jul 14 #Javascript
You might like
PHP 5.0对象模型深度探索之对象复制
2008/03/27 PHP
phpMyAdmin 安装配置方法和问题解决
2009/06/08 PHP
处理php自动反斜杠的函数代码
2010/01/05 PHP
yii框架源码分析之创建controller代码
2011/06/28 PHP
php 短链接算法收集与分析
2011/12/30 PHP
php 创建以UNIX时间戳命名的文件夹(示例代码)
2014/03/08 PHP
在Linux系统下一键重新安装WordPress的脚本示例
2015/06/30 PHP
php 升级到 5.3+ 后出现的一些错误,如 ereg(); ereg_replace(); 函数报错
2015/12/07 PHP
PHP简单装饰器模式实现与用法示例
2017/06/22 PHP
javascript void(0)的妙用
2009/10/21 Javascript
Jquery AJAX POST与GET之间的区别
2013/11/14 Javascript
JavaScript的9种继承实现方式归纳
2015/05/18 Javascript
location.hash保存页面状态的技巧
2016/04/28 Javascript
Javascript的无new构建实例详解
2016/05/15 Javascript
如何用JavaScript实现动态修改CSS样式表
2016/05/20 Javascript
js中数组插入、删除元素操作的方法
2017/02/15 Javascript
jQuery实现html table行Tr的复制、删除、计算功能
2017/07/10 jQuery
jQuery实现可兼容IE6的滚动监听功能
2017/09/20 jQuery
js使用swiper实现层叠轮播效果实例代码
2018/12/12 Javascript
用python 制作图片转pdf工具
2015/01/30 Python
Python实现二分查找与bisect模块详解
2017/01/13 Python
Python用于学习重要算法的模块pygorithm实例浅析
2018/08/16 Python
Python进阶之自定义对象实现切片功能
2019/01/07 Python
Python基础之函数的定义与使用示例
2019/03/23 Python
python通过SSH登陆linux并操作的实现
2019/10/10 Python
Python实现屏幕录制功能的代码
2020/03/02 Python
django执行原始查询sql,并返回Dict字典例子
2020/04/01 Python
Python第三方包PrettyTable安装及用法解析
2020/07/08 Python
Python 的 __str__ 和 __repr__ 方法对比
2020/09/02 Python
使用HTML5技术开发一个属于自己的超酷颜色选择器
2013/09/22 HTML / CSS
Artist Guitars新西兰:乐器在线商店
2017/09/17 全球购物
倩碧澳大利亚官网:Clinique澳大利亚
2019/07/22 全球购物
JAVA的事件委托机制和垃圾回收机制
2014/09/07 面试题
优秀驾驶员先进事迹材料
2014/05/04 职场文书
Vue Element UI自定义描述列表组件
2021/05/18 Vue.js
用 Python 定义 Schema 并生成 Parquet 文件详情
2021/09/25 Python