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 相关文章推荐
JS 继承实例分析
Nov 04 Javascript
jQuery阻止冒泡和HTML默认操作
Nov 17 Javascript
js的touch事件的实际引用
Oct 13 Javascript
js读取cookie方法总结
Oct 31 Javascript
《JavaScript DOM 编程艺术》读书笔记之JavaScript 图片库
Jan 09 Javascript
让DIV的滚动条自动滚动到最底部的3种方法(推荐)
Sep 24 Javascript
node.js 中间件express-session使用详解
May 20 Javascript
慕课网题目之js实现抽奖系统功能
Sep 19 Javascript
看看“疫苗查询”小程序有温度的代码
Jul 31 Javascript
解决微信小程序防止无法回到主页的问题
Sep 28 Javascript
基于Fixed定位的框选功能的实现代码
May 13 Javascript
从Node.js事件触发器到Vue自定义事件的深入讲解
Jun 26 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
PHP4引用文件语句的对比
2006/10/09 PHP
NT IIS下用ODBC连接数据库
2006/10/09 PHP
php基础学习之变量的使用
2011/06/09 PHP
PHP简洁函数(PHP简单明了函数语法)
2012/06/10 PHP
Laravel 4 初级教程之安装及入门
2014/10/30 PHP
学习php设计模式 php实现抽象工厂模式
2015/12/07 PHP
Laravel Eloquent分表方法并使用模型关联的实现
2019/11/25 PHP
比较详细的关于javascript中void(0)的具体含义解释
2007/08/02 Javascript
JS 面向对象之神奇的prototype
2011/02/26 Javascript
一个简单的动态加载js和css的jquery代码
2014/09/01 Javascript
基于JavaScript操作DOM常用的API小结
2015/12/01 Javascript
jQuery实现两列等高并自适应高度
2016/12/22 Javascript
创建简单的node服务器实例(分享)
2017/06/23 Javascript
解决Vue2.0自带浏览器里无法打开的原因(兼容处理)
2017/07/28 Javascript
前端开发不得不知的10个最佳ES6特性
2017/08/30 Javascript
Angular中点击li标签实现更改颜色的核心代码
2017/12/08 Javascript
小程序实现选择题选择效果
2018/11/04 Javascript
Vue插件之滑动验证码
2019/09/21 Javascript
JS面向对象编程基础篇(三) 继承操作实例详解
2020/03/03 Javascript
解决Element中el-date-picker组件不回填的情况
2020/11/07 Javascript
vue监听滚动事件的方法
2020/12/21 Vue.js
[00:47]DOTA2荣耀之路6:玩不了啦!
2018/05/30 DOTA
Python中os.path用法分析
2015/01/15 Python
Python中is和==的区别详解
2018/11/15 Python
python-docx文件定位读取过程(尝试替换)
2020/02/13 Python
PyQt5高级界面控件之QTableWidget的具体使用方法
2020/02/23 Python
Huda Beauty官方商店:化妆和美容产品
2020/09/05 全球购物
揭牌仪式策划方案
2014/05/28 职场文书
预防传染病方案
2014/06/14 职场文书
拒绝黄毒毒宣传标语
2014/06/26 职场文书
2014年部门工作总结
2014/11/12 职场文书
优秀班主任主要事迹材料
2014/12/16 职场文书
一封真诚的自荐信帮你赢得机会
2019/05/07 职场文书
用python基于appium模块开发一个自动收取能量的小助手
2021/09/25 Python
MongoDB连接数据库并创建数据等使用方法
2021/11/27 MongoDB
SQL Server携程核心系统无感迁移到MySQL实战
2022/06/01 SQL Server