js注意img图片的onerror事件的分析


Posted in Javascript onJanuary 01, 2011

经过分析,发现网页中存在类似如下的代码:

<img src="pic.gif" onerror="javascript:this.src='/noPic.gif';" alt="pic" />
分析:特别注意 onerror,当图片不存在时,将触发 onerror,而 onerror 中又为 img 指定一个 NoPic.gif 图片。也就是说图片存在则显示 pic.gif,图片不存在将显示 noPic.gif。但问题来了,如果 noPic.gif 也不存在,则继续触发 onerror,导致循环,故出现错误。

说明:如果图片存在,但网络很不通畅,也可能触发 onerror。

解决方法:

第一种::.去掉 onerror 代码;或者更改 onerror 代码为其它;或者确保 onerror 中的图片足够小,并且存在。

第二种:

<script type="text/javascript"> 
<!? 
function nofind(){ 
var img=event.srcElement; 
img.src="../../../sys/common/image/fileoperation/icon/default.gif"; 
img.onerror=null; 控制不要一直跳动 
} 
//?> 
</script> 
<td align="center"><img src="../../../sys/common/image/fileoperation/icon/${file.suffix }.gif" onerror="nofind();" />${file.name }</td>
Javascript 相关文章推荐
彪哥1.1(智能表格)提供下载
Sep 07 Javascript
IE8对JS通过属性和数组遍历解析不一样的地方探讨
May 06 Javascript
一个js导致的jquery失效问题的解决方法
Nov 27 Javascript
JS组件系列之Bootstrap Icon图标选择组件
Jan 28 Javascript
Extjs实现下拉菜单效果
Apr 01 Javascript
深入理解JavaScript定时机制
Oct 27 Javascript
js实现消息滚动效果
Jan 18 Javascript
js实现不提示直接关闭网页窗口
Mar 30 Javascript
ES6新特性之解构、参数、模块和记号用法示例
Apr 01 Javascript
详解Vue 普通对象数据更新与 file 对象数据更新
Apr 26 Javascript
js精确的加减乘除实例
Nov 14 Javascript
vue的无缝滚动组件vue-seamless-scroll实例
Dec 18 Javascript
JavaScript 计算图片加载数量的代码
Jan 01 #Javascript
jQuery jqgrid 对含特殊字符json 数据的 Java 处理方法
Jan 01 #Javascript
基于jQuery架构javascript基础体系
Jan 01 #Javascript
jQuery技巧总结
Jan 01 #Javascript
js中查找最近的共有祖先元素的实现代码
Dec 30 #Javascript
Js 弹出框口并返回值的两种常用方法
Dec 30 #Javascript
JavaScript之appendChild、insertBefore和insertAfter使用说明
Dec 30 #Javascript
You might like
web目录下不应该存在多余的程序(安全考虑)
2012/05/09 PHP
php实现的任意进制互转类分享
2015/07/07 PHP
PHP实现小偷程序实例
2016/10/31 PHP
jQuery学习5 jQuery事件模型
2010/02/07 Javascript
url参数中有+、空格、=、%、&amp;、#等特殊符号的问题解决
2013/05/15 Javascript
浅谈js中变量初始化
2015/02/03 Javascript
javascript中in运算符用法分析
2015/04/28 Javascript
javascript使用avalon绑定实现checkbox全选
2015/05/06 Javascript
用svg制作富有动态的tooltip
2015/07/17 Javascript
jquery实现的简单二级菜单效果代码
2015/09/22 Javascript
基于JavaScript判断浏览器到底是关闭还是刷新(超准确)
2016/02/01 Javascript
JavaScript Ajax实现异步通信
2016/12/14 Javascript
微信小程序 chooseImage选择图片或者拍照
2017/04/07 Javascript
详解Node项目部署到云服务器上
2017/07/12 Javascript
利用canvas中toDataURL()将图片转为dataURL(base64)的方法详解
2017/11/20 Javascript
Javascript实现购物车功能的详细代码
2018/05/08 Javascript
vue 录制视频并压缩视频文件的方法
2018/07/27 Javascript
详解ES6 Symbol 的用途
2018/10/14 Javascript
js中的深浅拷贝问题简析
2019/05/10 Javascript
layui form表单提交之后重新加载数据表格的方法
2019/09/11 Javascript
Vue获取微博授权URL代码实例
2020/11/04 Javascript
Python获取脚本所在目录的正确方法
2014/04/15 Python
windows下添加Python环境变量的方法汇总
2018/05/14 Python
Python中pandas模块DataFrame创建方法示例
2018/06/20 Python
Atom的python插件和常用插件说明
2018/07/08 Python
利用ctypes获取numpy数组的指针方法
2019/02/12 Python
python装饰器简介---这一篇也许就够了(推荐)
2019/04/01 Python
Python如何定义有默认参数的函数
2020/08/10 Python
简单的命令查看安装的python版本号
2020/08/28 Python
法国创作个性化T恤衫和其他定制产品平台:Tostadora
2018/04/08 全球购物
女性时尚网购:Chic Me
2019/07/30 全球购物
心理学专业大学生职业生涯规划范文
2014/02/19 职场文书
病媒生物防治方案
2014/05/13 职场文书
水利水电建筑施工应届生求职信
2014/07/04 职场文书
新教师2015年度工作总结
2015/07/22 职场文书
不知如何爱孩子,这些方法教会您
2019/08/06 职场文书