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 操作XML入门
Dec 25 Javascript
javascript mouseover、mouseout停止事件冒泡的解决方案
Apr 07 Javascript
JS获取url链接字符串 location.href
Dec 23 Javascript
JS实现两表格里数据来回转移的方法
May 28 Javascript
javascript实现点击提交按钮后显示loading的方法
Jul 03 Javascript
javascript实现页面刷新时自动清空表单并选中的方法
Jul 18 Javascript
JS禁止查看网页源代码的实现方法
Oct 12 Javascript
jQuery实现手机上输入后隐藏键盘功能
Jan 04 Javascript
Vue-Router实现页面正在加载特效方法示例
Feb 12 Javascript
jQuery实现轮播图源码
Oct 23 jQuery
vue大型项目之分模块运行/打包的实现
Sep 21 Javascript
使用js获取身份证年龄的示例代码
Dec 11 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从数据库查询结果生成树形列表的方法
2015/04/17 PHP
JQuery 无废话系列教程(一) jquery入门 [推荐]
2009/06/23 Javascript
IE 下的只读 innerHTML
2009/08/21 Javascript
firefox插件Firebug的使用教程
2010/01/02 Javascript
使用javascipt---实现二分查找法
2013/04/10 Javascript
JavaScript代码轻松实现网页内容禁止复制(代码简单)
2015/10/23 Javascript
jquery实现全屏滚动
2015/12/28 Javascript
浅析jQuery Ajax请求参数和返回数据的处理
2016/02/24 Javascript
功能强大的Bootstrap效果展示(二)
2016/08/03 Javascript
分享JS数组求和与求最大值的方法
2016/08/11 Javascript
值得分享和收藏的xmlplus组件学习教程
2017/05/05 Javascript
vue 修改 data 数据问题并实时显示的方法
2018/08/27 Javascript
解决JavaScript中0.1+0.2不等于0.3问题
2018/10/23 Javascript
Vue+Vuex实现自动登录的知识点详解
2020/03/04 Javascript
JavaScript编写开发动态时钟
2020/07/29 Javascript
jQuery zTree如何改变指定节点文本样式
2020/10/16 jQuery
[42:24]完美世界DOTA2联赛循环赛 LBZS vs DM BO2第一场 11.01
2020/11/02 DOTA
Python实现通过文件路径获取文件hash值的方法
2017/04/29 Python
python机器学习理论与实战(五)支持向量机
2018/01/19 Python
Python+PIL实现支付宝AR红包
2018/02/09 Python
实例详解Matlab 与 Python 的区别
2019/04/26 Python
python卸载后再次安装遇到的问题解决
2019/07/10 Python
pycharm修改文件的默认打开方式的步骤
2019/07/29 Python
elasticsearch python 查询的两种方法
2019/08/04 Python
python脚本执行CMD命令并返回结果的例子
2019/08/14 Python
python线程的几种创建方式详解
2019/08/29 Python
通过实例了解Python异常处理机制底层实现
2020/07/23 Python
Python3.8安装Pygame教程步骤详解
2020/08/14 Python
Python爬虫爬取有道实现翻译功能
2020/11/27 Python
html5通过postMessage进行跨域通信的方法
2017/12/04 HTML / CSS
外贸英语毕业生自荐信
2013/11/14 职场文书
党的群众路线查摆剖析材料
2014/10/10 职场文书
2014年财政工作总结
2014/12/10 职场文书
年度考核表个人总结
2015/03/06 职场文书
红色革命电影观后感
2015/06/18 职场文书
MySQL控制流函数(-if ,elseif,else,case...when)
2022/07/07 MySQL