更好的图片加载失败处理方法

有常常加载图片失败吗?用 jQuery 替换源来提醒用户:加载失败。

// 方法 1:更换图片地址
$('img').error(function(){
    $(this).attr('src', '加载失败.png');
});
 
// 方法 2:隐藏它
$("img").error(function(){
    $(this).hide();
});

演示:这里

via: css-tricks.com


补充:
Nginx 可以用 try_files 的fallback

location ~ ^/images/ {
    try_files $uri /images/default.gif;
}

就是访问 http://example.com/images/background.png
如果文件存在,就显示
如果文件不存在就用缺省图片来填掉这个丢失的图片


更新:jQuery 1.8 开始弃用 .error(),找别的方法吧

更新2:不推荐用 nginx 的 try_files,会有很多问题的。。。所以还是用 javascript 的方法吧