怪自己知道的太少,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. hibernate缓存机制和事务隔离机制

    一级缓存( Session缓存) }         一级缓存的管理 ◦          应用程序调用Session的save().update().saveOrUpdate().get()或loa ...

  2. Keil中使用Astyel进行C语言的格式化

    Astyel !E --style=linux --delete-empty-lines --indent=spaces=2 --break-blocks 这可以做到, 使用Linux风格的代码 ) ...

  3. MVC 使用jQuery上传文件

    在ASP.NET MVC Framework中,上传文件真是超级简单,看代码: View <formaction="<%=Url.Action("Process&quo ...

  4. [android] 百度地图开发 (两).所在地的城市定位和城市POI搜索

    一个. 百度地图城市位置和POI搜索知识       上一篇文章"百度地图开发(一)"中讲述了怎样申请百度APIKey及解决显示空白网格的问题.该篇文章主要讲述怎样定位城市位置.定 ...

  5. Rails当你运行一个数据库回滚错误:ActiveRecord::IrreversibleMigration exception

    最近rails3.2在更改数据库表字段,然后要回滚取消,但在运行rake db:rollback命令,错误: rake aborted! An error has occurred, all late ...

  6. 【转】怎么导出jar包

    如何导出jar包 右键工程->Export->Java->JAR file->Next-> Next 选中工程和工程中你要打包的内容,如果是Android的项目,需要把M ...

  7. 编解码器的学习笔记(十):Ogg系列

    Ogg是一个自由和开放的标准容器格式,由Xiph.Org 维修基金. Ogg格式不受软件专利的限制,它的目的是有效地处理高品质的流媒体和数字媒体. Ogg意指一种文件格式,能够纳入各式各样自由和开放源 ...

  8. CSS3中文手册基础知识

    CSS3手册是学习CSS3的最佳文档,不管是自己写博客,还是买书,手册少不了.今天我给大家介绍一些CSS3有哪些分类及其使用. 具体参考:http://caibaojian.com/css3/ 上来进 ...

  9. DataInputStream(二进制输入流)和DataOutputStream二进制输出流(注意:in是从本地文件输入到程序中,out是从程序输出到本地种)

    //切记以数据类型输出就以什么数据类型读入, //例如: dos.writeInt(100);写入,读取:dis.readUTF()有时会出现意想不到的错误,所以要时刻记得以数据类型输出就以什么数据类 ...

  10. Roslyn 编译平台概述

    在Language Feature Status上面看到,其实更新的并不是特别多,为了不会误导看了C# 6.0 功能预览 (一)的园友,现在把官方的更新列表拿了过来,供大家参考 C# 6.0 功能预览 ...