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 相关文章推荐
js电信网通双线自动选择技巧
Nov 18 Javascript
jquery blockUI 遮罩不能消失与不能提交的解决方法
Sep 17 Javascript
深入理解jQuery中live与bind方法的区别
Dec 18 Javascript
使用AngularJS创建单页应用的编程指引
Jun 19 Javascript
javascript图片预加载完整实例
Dec 10 Javascript
js判断是否为空和typeof的用法(详解)
Oct 07 Javascript
微信小程序 数据绑定详解及实例
Oct 25 Javascript
详解jQuery中的DOM操作
Dec 23 Javascript
js获取隐藏元素的宽高
Feb 24 Javascript
Bootstrap table使用方法记录
Aug 23 Javascript
jQuery实现html双向绑定功能示例
Oct 09 jQuery
使用vue-element-admin框架从后端动态获取菜单功能的实现
Apr 29 Vue.js
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
phpexcel导入excel数据使用方法实例
2013/12/24 PHP
php根据isbn书号查询amazon网站上的图书信息的示例
2014/02/13 PHP
C/S和B/S两种架构区别与优缺点分析
2014/10/23 PHP
PHP遍历数组的方法汇总
2015/04/30 PHP
PHP不使用内置函数实现字符串转整型的方法示例
2017/07/03 PHP
js显示时间 js显示最后修改时间
2013/01/02 Javascript
基于JavaScript实现继承机制之构造函数+原型链混合方式的使用详解
2013/05/07 Javascript
js判断两个日期是否相等的方法
2013/09/10 Javascript
javascript history对象(历史记录)使用方法(实现浏览器前进后退)
2014/01/07 Javascript
js实现checkbox全选和反选示例
2014/05/01 Javascript
jquery中filter方法用法实例分析
2015/02/06 Javascript
Bootstrap中点击按钮后变灰并显示加载中实例代码
2016/09/23 Javascript
10 种最常见的 Javascript 错误(频率最高)
2018/02/08 Javascript
antd Upload 文件上传的示例代码
2018/12/14 Javascript
微信小程序学习笔记之登录API与获取用户信息操作图文详解
2019/03/29 Javascript
微信小程序代码上传、审核发布小程序
2019/05/18 Javascript
VSCode搭建Vue项目的方法
2020/04/30 Javascript
js实现全选和全不选功能
2020/07/28 Javascript
python调用cmd复制文件代码分享
2013/12/27 Python
零基础学Python(一)Python环境安装
2014/08/20 Python
python 实现语音聊天机器人的示例代码
2018/12/02 Python
Python函数基础实例详解【函数嵌套,命名空间,函数对象,闭包函数等】
2019/03/30 Python
python调用matplotlib模块绘制柱状图
2019/10/18 Python
python实现异常信息堆栈输出到日志文件
2019/12/26 Python
python中文分词库jieba使用方法详解
2020/02/11 Python
django 取消csrf限制的实例
2020/03/13 Python
10分钟理解CSS3 Grid布局
2018/12/20 HTML / CSS
Html5新标签datalist实现输入框与后台数据库数据的动态匹配
2017/05/18 HTML / CSS
美国知名男士服饰品牌:Brooks Brothers(布克兄弟)
2016/08/25 全球购物
Willer台湾:日本高速巴士/夜行巴士预约
2017/07/09 全球购物
高品质和独特的产品世界:Creations and Collections
2018/01/07 全球购物
安德玛比利时官网:Under Armour比利时
2019/08/28 全球购物
捷克母婴用品购物网站:Feedo.cz
2020/12/28 全球购物
综合办公室主任岗位职责
2015/04/01 职场文书
工程项目合作意向书
2015/05/08 职场文书
OpenCV-Python实现图像平滑处理操作
2021/06/08 Python