圖像中檢測是否在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處理所有跨瀏覽器問題。 –

回答