图像中检测是否在Javascript

打破我将图像添加到使用JavaScript的HTML5画布：图像中检测是否在Javascript

img = new Image(); 
img.addEventListener('load', loadCallBack, false); 
img.src = image_url;

然后loadCallBack绘制图像。

问题是，有时image_url指的是一个破碎或不存在的图像。发生这种情况时，控制台中出现404错误，画布上的图像保持白色。相反，我希望能够将图像的src属性替换为另一个image_url。

我尝试以下，并没有奏效：

img.addEventListener("error", function(){console.log("404");});

如何检测图像的404？

注意：我仍在寻找解决方案，因为迄今为止发布的两个都没有工作。

的'错误“事件似乎工作（在Chrome中，至少）：http://jsfiddle.net/qgJRF/ – bfavaretto

我已经编辑了标题; 'Image（）'javascript class在HTML5之前就存在了（澄清）。由于您提到了画布，我已将HTML5标签留下了您的问题。 – Christian

但是这听起来像这样的问题：http://stackoverflow.com/questions/92720/jquery-javascript-to-replace-broken-images – LonelyWebCrawler

img = new Image(); 
$(img).bind('error', function() { 
     alert('error called');             
}); 
img.src = "invalid_img_name.png";

2012-09-06 20:06:24 Kostia

我正在寻找让你的解决方案工作，谢谢。 – LonelyWebCrawler

我不幸得不到这个工作。 – LonelyWebCrawler

@LonelyWebCrawler你使用jQuery吗？只要您在尝试加载图像src之前附加.bind（）事件处理程序，它就应该可以工作。 – Kostia

的相同的代码科斯佳的回答：只是为了比较的jQuery的丑陋和香草的JavaScript的美：

2012-09-06 22:11:24

请记住，直接分配给onerror处理程序将覆盖可能分配的任何其他错误事件处理程序。对于简单的情况可能不是问题 - 但大多数情况下最好使用img.addEventListener（“错误”... - 尽管如此，您必须使用addEventListener处理所有跨浏览器问题。 –

回答