javascript 检查 img src 是否有效？ [复制]答案

【问题标题】：javascript check if img src is valid? [duplicate]javascript 检查 img src 是否有效？ [复制]
【发布时间】：2011-03-30 19:41:47
【问题描述】：

我有类似的东西：

document.getElementById('MyPicture').src = 'attempted.png';

如果客户端无法获取该资源，我想将其替换为：

document.getElementById('MyPicture').src = 'error.png'

我知道我可以将 onError=function() 放在图像标签中，但是如何将 Id 传递给 onError，以便我可以拥有一个可以更改任何坏图片的 src 的 onError 函数？

【问题讨论】：

标签： javascript image src

【解决方案1】：

添加 onError 属性确实是正确的处理方式。在你的情况下，你会添加类似的东西：

var myPicture = document.getElementById('MyPicture');
myPicture.onError = errorHandler();

function errorHandler(msg,file_loc,line_num) {
  myPicture.src = 'http://www.google.com/intl/en_ALL/images/srpr/logo1w.png';
}

【讨论】：

【解决方案2】：

是的，你可以使用onerror事件，在图像元素上确实是widely supported，例如：

var image = document.getElementById('MyPicture');
image.onerror = function () {
  alert('error loading ' + this.src);
  this.src = 'error.png'; // place your error.png image instead
};

image.src = 'non-existing.jpg';

查看示例here。

【讨论】：

【解决方案3】：

把这个放在图片标签里：

onError="image_error(this.id)"

这会将图像的 id 传递给 image_error 函数.... duh

【讨论】：