javascript容错处理代码(屏蔽js错误)


Posted in Javascript onJanuary 20, 2017

有时候大家来浏览网页的时候发现IE浏览器左下角总有个黄色错误标志,有时候更是直接弹出错误无法继续浏览页面,这样对于网站的正规性与权威性发展不利。

国外银行页面就是因为这样的错误,导致用户大量流失不敢用这个银行的网上银行等导致损失惨重。

所以一个想要在用户体验与公司实力上都是不容出现的错误,就是不影响使用也不能让用户反感,三水点靠木一直致力于为大家提高更好的代码,所以这里我们将会大家整理一些常用的代码,使用方法什么,希望大家以后能越来越支持我们,让我们共同发展。

第一种:三水点靠木在用的

<SCRIPT language=javascript> 
<!-- 
window.onerror=function(){return true;} 
// --> 
</SCRIPT>

使用方法:把以上代码加到你出错网页的head区域就可以了。

第二种:针对的是有时候因为一些脚本错误的,导致页面无法继续浏览,这个问题是非常严重的,用户的大量流失,或根本无法查看你的网站内日

这个不是简单的脚本错误的问题了,主要是代码作者没有考虑完善,一定要好好的修改下, 不过如果你真的不会,那就用这样的代码吧

try...catch 可以测试代码中的错误。try 部分包含需要运行的代码,而 catch 部分包含错误发生时运行的代码。

语法:

复制代码 代码如下:

try 
{ 
//在此运行代码 
} 
catch(err) 
{ 
//在此处理错误 
}

注意:try...catch 使用小写字母。大写字母会出错。

实例 1

下面的例子原本用在用户点击按钮时显示 "Welcome guest!" 这个消息。不过 message() 函数中的 alert() 被误写为 adddlert()。这时错误发生了:

<html> 
<head> 
<script type="text/javascript"> 
function message() 
{ 
adddlert("Welcome guest!") 
} 
</script> 
</head> 
<body> 
<input type="button" value="View message" onclick="message()" /> 
</body> 
</html>

我们可以添加 try...catch 语句,这样当错误发生时可以采取更适当的措施。

下面的例子用 try...catch 语句重新修改了脚本。由于误写了 alert(),所以错误发生了。不过这一次,catch 部分捕获到了错误,并用一段准备好的代码来处理这个错误。这段代码会显示一个自定义的出错信息来告知用户所发生的事情。

<html> 
<head> 
<script type="text/javascript"> 
var txt="" 
function message() 
{ 
try 
{ 
adddlert("Welcome guest!") 
} 
catch(err) 
{ 
txt="此页面存在一个错误。\n\n" 
txt+="错误描述: " + err.description + "\n\n" 
txt+="点击OK继续。\n\n" 
alert(txt) 
} 
} 
</script> 
</head> 
<body> 
<input type="button" value="View message" onclick="message()" /> 
</body> 
</html>

实例 2

下一个例子会显示一个确认框,让用户来选择在发生错误时点击确定按钮来继续浏览网页,还是点击取消按钮来回到首页。如果 confirm 方法的返回值为 false,代码会把用户重定向到其他的页面。如果 confirm 方法的返回值为 true,那么代码什么也不会做。

<html> 
<head> 
<script type="text/javascript"> 
var txt="" 
function message() 
{ 
try 
{ 
adddlert("Welcome guest!") 
} 
catch(err) 
{ 
txt="There was an error on this page.\n\n" 
txt+="Click OK to continue viewing this page,\n" 
txt+="or Cancel to return to the home page.\n\n" 
if(!confirm(txt)) 
{ 
document.location.href="http://www.w3school.com.cn/" 
} 
} 
} 
</script> 
</head> 
<body> 
<input type="button" value="View message" onclick="message()" /> 
</body> 
</html>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
基于jquery的bankInput银行卡账号格式化
Aug 22 Javascript
在js文件中写el表达式取不到值的原因及解决方法
Dec 23 Javascript
Javasipt:操作radio标签详解
Dec 30 Javascript
jquery 获取dom固定元素 添加样式的简单实例
Feb 04 Javascript
鼠标滑过出现预览的大图提示效果
Feb 26 Javascript
js判断ie版本号的简单实现代码
Mar 05 Javascript
Javascript设计模式之观察者模式(推荐)
Mar 29 Javascript
用js实现放大镜的效果的简单实例
May 23 Javascript
JQuery的常用选择器、过滤器、方法全面介绍
May 25 Javascript
vue中如何引入jQuery和Bootstrap
Apr 10 jQuery
angular4 如何在全局设置路由跳转动画的方法
Aug 30 Javascript
Vue项目中ESlint规范示例代码
Jul 04 Javascript
关于AngularJs数据的本地存储详解
Jan 20 #Javascript
html5 canvas 详细使用教程
Jan 20 #Javascript
canvas绘制万花筒效果(代码分享)
Jan 20 #Javascript
原生js实现网页顶部自动下拉/收缩广告效果
Jan 20 #Javascript
Angular.js中ng-if、ng-show和ng-hide的区别介绍
Jan 20 #Javascript
轻松理解Javascript变量的相关问题
Jan 20 #Javascript
js+css3实现旋转效果
Jan 20 #Javascript
You might like
PHP 输出缓存详解
2009/06/20 PHP
PHP pathinfo()获得文件的路径、名称等信息说明
2011/09/13 PHP
ThinkPHP 3.2.2实现事务操作的方法
2017/05/05 PHP
jquery下将选择的checkbox的id组成字符串的方法
2010/11/28 Javascript
jquery中交替点击事件的实现代码
2014/02/14 Javascript
jquery.mobile 共同布局遇到的问题小结
2015/02/10 Javascript
JS使用ajax方法获取指定url的head信息中指定字段值的方法
2015/03/24 Javascript
JavaScript职责链模式概述
2016/09/17 Javascript
Bootstrap源码解读标签、徽章、缩略图和警示框(8)
2016/12/26 Javascript
Bootstrap表单使用方法详解
2017/02/17 Javascript
vue2.0的contextmenu右键弹出菜单的实例代码
2017/07/24 Javascript
Node.js中Koa2在控制台输出请求日志的方法示例
2019/05/02 Javascript
jquery树形插件zTree高级使用详解
2019/08/16 jQuery
浅谈layui 数据表格前后台传值的问题
2019/09/12 Javascript
使用原生JS实现火锅点餐小程序(面向对象思想)
2019/12/10 Javascript
微信小程序实现签字功能
2019/12/23 Javascript
js闭包和垃圾回收机制示例详解
2021/03/01 Javascript
python计算书页码的统计数字问题实例
2014/09/26 Python
Pyhthon中使用compileall模块编译源文件为pyc文件
2015/04/28 Python
Python IDLE 错误:IDLE''s subprocess didn''t make connection 的解决方案
2017/02/13 Python
python 生成器生成杨辉三角的方法(必看)
2017/04/10 Python
python 多线程重启方法
2019/02/18 Python
Python 根据日志级别打印不同颜色的日志的方法示例
2019/08/08 Python
Django为窗体加上防机器人的验证码功能过程解析
2019/08/14 Python
Python实现socket非阻塞通讯功能示例
2019/11/06 Python
python装饰器相当于函数的调用方式
2019/12/27 Python
印度最大的网上花店:Ferns N Petals(鲜花、礼品和蛋糕)
2017/10/16 全球购物
AutoShack.com加拿大:北美主要的汽车零部件零售商
2019/07/24 全球购物
音乐学专业求职信
2014/07/22 职场文书
我与祖国共奋进演讲稿
2014/09/13 职场文书
党的群众路线对照检查材料
2014/09/22 职场文书
2014幼儿园卫生保健工作总结
2014/12/05 职场文书
2016年重阳节慰问信
2015/12/01 职场文书
用Python简陋模拟n阶魔方
2021/04/17 Python
使用vue-element-admin框架从后端动态获取菜单功能的实现
2021/04/29 Vue.js
详解前端任务构建利器Gulp.js使用指南
2021/04/30 Javascript