怪自己知道的太少,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. DDD分层架构的进化

    .NET逻辑分层架构演示:DDD分层架构的进化 概述:   架构是高层的设计,如果设计和理解有误,必将在实现时带来各种问题.架构又是最稳定的,不会因为各种具体技术的依赖,如各种UI框架.ORM框架.I ...

  2. ActivityLifeCycle官方demo分解

    1.左右Activity生命周期的若干条款: p=330">http://1.duoinfo.sinaapp.com/? p=330 http://1.duoinfo.sinaapp. ...

  3. Android自己定义控件系列五:自己定义绚丽水波纹效果

    尊重原创!转载请注明出处:http://blog.csdn.net/cyp331203/article/details/41114551 今天我们来利用Android自己定义控件实现一个比較有趣的效果 ...

  4. 【Android开发日记】第一个任务Android Service!Service靴+重力感应器+弹出窗口+保持执行

    前言: 近期在写一个小程序,需求是手机摇一摇就弹窗出来.第一次使用了Service,学习了两天,实现了Service弹窗,开机启动,Service启动和销毁,Service保持一直执行. 满足了自己的 ...

  5. ANDROID定义自己的观点——模仿瀑布布局(源代码)

    转载请注明本文出自大苞米的博客(http://blog.csdn.net/a396901990),谢谢支持! 简单介绍: 在自己定义view的时候,事实上非常easy,仅仅须要知道3步骤: 1.測量- ...

  6. WEB安全实战(五)XSS 攻击的第二种解决方式(推荐)

    序 说到 XSS 攻击,前边已经有两篇文章在讲这个事了,这次又拿出来说,主要是针对近期工作中的一些新的问题.那么之前是怎么解决问题的呢?为什么又要换解决方式?以下就具体的跟大家分享一下. 旧方案 公司 ...

  7. SQL点滴20—T-SQL中的排名函数

    原文:SQL点滴20-T-SQL中的排名函数 提到排名函数我们首先可能想到的是order by,这个是排序,不是排名,排名需要在前面加个名次序号的,order by是没有这个功能的.还可能会想到ide ...

  8. Gimp教程:制作彩色的网站横幅

    效果图: Step1.新建900x200的透明图层 Step2.点选画笔工具,在左下方的设置界面进行如下: 设置画笔,动态,颜色,勾选应用抖动,然后试着在图层上画一画,调节一下画笔大小,相信你能作出如 ...

  9. LeetCode之Max Points on a Line Total

    1.问题描述 Given n points on a 2D plane, find the maximum number of points that lie on the same straight ...

  10. 使用Clean() 去掉由函数自动生成的字符串中的双引号

    有时候由Excel单元格函数軿凑出来的字符串会自带双引号 效果如下: 想这种这个情况,刚好我们軿凑出来的是SQL语句, 执行的时候是去掉双引号, 这时候可以使用Excel自带的函数来去掉双引号 Cle ...