怪自己知道的太少,img标签有onerror这个事件,我是才刚知道,恕我愚昧,既然是第一次遇到,而且又是一个自己从没有涉及过得的东西,所以我希望通过这个随笔来是自己印象深刻,此文仅仅只是让自己印象深刻的水文,知道这个事件的诸位尽可以绕道而行了,如果你也没有涉及,或者你也不曾知晓这个事件的话,就随我一起来了解下这个属性吧.....

根据w3cschool:

onerror事件会在文档或图片加载过程中发生错误时被触发,支持该事件的HTML标签有:img,object,style;实例如下:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>onerror 测试</title>
<meta name="description" content="" />
<meta name="author" content="" /> </head>
<body> <img onerror="onerror=null;src='http://www.lanrenzhijia.com/images/error.jpg'" src="img/f0.jpg"/> </body>
</html>

  

这段代码中,如果img的src属性中的图片不存在,或者发生错误,将会触发onerror事件,error事件将为src重新加载一张存在的图片,但是如果onerror中的图片也不存在呐?

如果error的事件也不存在的话,将再次调用onerror,但是error中的图片也是错的,所以基于微软的一套核心的浏览器IE就会认为这是死循环 
然后就会报 stack overflow line: 0的错误。

为了解决这个问题,所以,一般在onerror中都会先将onerror事件先清除掉(即onerror = null),再进行复制,这样就不会存在循环调用的问题了

img onerror事件的更多相关文章

  1. 加载默认图片,如何避免img标签陷入onerror事件死循环

    当图片加载失败的时候,我们可以利用onerror事件赋予它默认图片,但是问题来了,假如默认图片又不存在呢,即加载失败,这个时候就会陷入死循环. 为了避免死循环的情况,我们可以在执行完onerror事件 ...

  2. img的onerror事件(瑕疵+解决办法)【转】

    显示图片的时候,为了更好的用户体验,可能会把一些没有图片的内容也用图片样式显示出来,此时我们就要用到IMG的onerror事件了,注意MyEclipse的快捷键alt+/是没有的. < img ...

  3. 基于window.onerror事件 建立前端错误日志

    QA不是万能的,用户的浏览环境非常复杂,很多情况无法靠测试用例去覆盖,所以最好建立一个前端错误日志,在真实用户端收集bug. try&catch是一个捕获前端错误的常见方法,比如: { //给 ...

  4. img的onerror事件

    使用场景 其实on error使用上是比较简单的. 当我们网站上出现了无效图片,而我们希望用友好的方式告诉用户,而不是显示红叉叉. w3c上解释的 定义和用法: onerror 事件会在文档或图像加载 ...

  5. 图片输出onerror事件

    <img src=".<?php echo $img[0];?>" onerror="this.src='img/zanwu.jpg'" st ...

  6. img标签的onerror事件

    #情景分析: 有时,img标签中的src图片加载失败,原来的图片位置会出现一个碎片图标,这样让人很不爽,如何变得美观些呢? #解决方案: 可以借用img标签的onerror事件,img标签支持oner ...

  7. 解析img图片没找到onerror事件

    本篇文章主要介绍了img图片没找到onerror事件 Stack overflow at line: 0 需要的朋友可以过来参考下,希望对大家有所帮助 打开网页时提示 Stack overflow a ...

  8. [译]window.onerror事件

    本文翻译youtube上的up主kudvenkat的javascript tutorial播放单 源地址在此: https://www.youtube.com/watch?v=PMsVM7rjupU& ...

  9. <img/>标签onerror事件在IE下的bug和解决方法

    IE下打开网页时,会弹出“Stack overflow at line: 0”的弹框.经分析,这个bug是由于img标签的onerror事件引起的.程序中用到的代码片段如下:正常情况下显示src所指路 ...

随机推荐

  1. easyui datagrid load 封装 参数问题 js 作用域

    var temp = { LoginAccount: $('#LoginAccount').val(), ShopName: $('#ShopName').val() }; function doSe ...

  2. tinyxml 查找element

    下面这段代码是网上找来的,很是经典 bool GetNodePointerByName(TiXmlElement* pRootEle, const char* strNodeName,TiXmlEle ...

  3. 备份IIS httpd.ini 重写规则,兼容大部分版本号IISserver

    IISserver已经非常少,差点儿要退出市场了.nginx成为市场的主流. 备份一个httpd.ini,全部内容例如以下: [ISAPI_Rewrite] # 3600 = 1 hour Cache ...

  4. Sqlserver2008安装部署文档

    Sqlserver2008部署文档 注意事项: 如果你要安装的是64位的服务器,并且是新机器.那么请注意,你需要首先需要给64系统安装一个.net framework,如果已经安装此功能,请略过这一步 ...

  5. JAVA学习第三十四课 (经常使用对象API)—List集合及其子类特点

    整个集合框架中最经常使用的就是List(列表)和Set(集) 一.List集合 && Set的特点 Collection的子接口: 1.List:有序(存入和取出的顺序一致),元素都有 ...

  6. Angular指令(一)

    Angular开发者手册重点翻译之指令(一) 创建自定义的指令 这个文章将解释什么需要在自己的angularjs应用中创建自己的指令,以及如何实现它. 什么是指令 在高的层面上讲,指令是DOM元素中的 ...

  7. DirectX:函数连接两个随机filter

    函数连接两个随机filter HRESULT ConnectFilters( IBaseFilter *pSrc, IBaseFilter *pDest ) { IPin *pIn = 0; IPin ...

  8. 如何在局域网安装Redmine(转贴)

    如何在局域网安装Redmine(转贴) 分类: Redmine2009-06-01 10:31 1740人阅读 评论(0) 收藏 举报 phpmyadmin项目管理railssubversion数据库 ...

  9. C语言中的内存对齐

    最近看了好多,也编了好多C语言的浩强哥书后的题,总觉的很不爽,真的真的好怀念linux驱动的代码,好怀念那下划线,那结构体,虽然自己还很菜. 同时看了一遍陈正冲老师的C语言深度剖析,收益很多,又把唐老 ...

  10. intellij idea 学习

      intellij idea是一个java的ide.由jetbrain开发.     intellij idea快捷键 快捷键 说明 备注 Ctrl+N 快速导航到类 类似于Resharper中的C ...