HTML Image onload 触发 onerror？答案

【问题标题】：HTML Image onload triggers onerror?HTML Image onload 触发 onerror？
【发布时间】：2015-04-18 21:19:51
【问题描述】：

我有一个标记如下的html图像

   <image src = 'image.png' onerror = "handleError(this)" onload = "handleLoad(this)">

    function handleError(n){
        getFirstChild(n.parentNode).style.display = '',n.style.display = 'none';
    }

    function handleLoad(n){
        getFirstChild(n.parentNode).style.display = 'none',n.style.display = '';
    }

我有一个单独的函数 getFirstChild 但这与以下问题没有任何关系。

基本上，在 IE 11 中发生的事情是 onLoad 处理程序被触发并且我的函数正在正确设置显示，但是在触发 onload 之后，onerror 也会被触发并覆盖 handleLoad 函数所做的事情。遗憾的是，此应用程序仅在 IE 浏览器中受支持，但仅在 IE11 版本中发生，在 IE10 中按预期工作。

我不确定onLoad如何触发，然后在onLoad从src找到图像后立即触发onError。

第二次编辑

正如下面的评论所拍摄的，我无法在 IE11 上的 jfiddle 中重现这一点。这可能是因为我的代码试图同时做不同的事情，但是有什么方法可以查看为什么触发了 onerror 处理程序？我尝试打印出 Image 项的 src，但这似乎不是问题，因为 onError 和 onLoad 返回相同的 src，并且图像显然在那里。无论如何，我可以看到导致 onError 触发的原因是什么？

【问题讨论】：

不确定这是否是一个问题，但您在图像标签内的处理程序周围缺少引号。
啊，好的，没问题。我无法通过 jsFiddle 得到您在 IE11 (Win8) 中描述的错误。
@AWolf 如果有机会，我会用 HTML 的格式结构更新问题。
您可以使用 IE 开发者工具，设置断点并单步执行。访问页面时清除控制台，然后刷新并再次检查控制台。里面可能有错误...
@Tim 我使用了 IE 开发工具，但控制台中没有生成错误。我什至监控了网络，所有响应都没有错误地返回。我不知道还能去哪里看。

标签： javascript html asp.net onload onerror

【解决方案1】：

window.onload 事件被程序员用来启动他们的 web 应用程序。IE 支持一个非常方便（但非标准）的标签属性：defer。此属性的存在将指示 IE 将脚本的加载推迟到 DOM 加载之后。但是，这仅适用于外部脚本。另一个需要注意的重要事情是，不能使用脚本设置此属性。这意味着您不能使用 DOM 方法创建脚本并设置 defer 属性——它将被忽略。

使用方便的 defer 属性，我们可以创建一个小脚本来调用我们的 onload 处理程序：

<script defer src="ie_onload.js" type="text/javascript"></script>

这个外部脚本的内容将是调用我们的 onload 事件处理程序的一行代码：

init();
function init() {
// quit if this function has already been called
if (arguments.callee.done) return;

// flag this function so we don't do the same thing twice
arguments.callee.done = true;

// do stuff
};

正如我们所见，在 IE 中使用 DOM 事件处理程序存在许多问题，因此条件编译可能是解决 OP 问题的另一种选择。恕我直言，你应该去这个链接：

http://dean.edwards.name/weblog/2005/09/busted/

【讨论】：

这个答案和问题完全没有关系。