javascript - 404 图片的回退

Question

我每天都会使用 PHP 为附属网站自动导入多个 XML 提要(Tradetracker、Daisycon 等)。提要包含来自各种商店的产品。

一切都像魅力一样，除了图像。提要中的图像只是热链接到提供者的图像。这在大多数情况下都有效，但有时(由于各种原因)图像不再存在，受到热链接保护，被更改等。这会导致浏览器中出现“找不到图像”，这不会'看起来不错。

我尝试使用 htaccess 解决这个问题，但无论出于何种原因，它都不起作用。我用谷歌搜索并尝试了几个 htacces“脚本”，但没有一个没有成功。我还在图像 URL 中尝试了 JS，但这并没有奏效。我更喜欢 htaccess。

有人有什么建议吗？

使用 htaccess 替换图片

RewriteEngine on
<FilesMatch ".(jpg|png|gif)$">
ErrorDocument 404 "/noimage.jpg"
</FilesMatch>

使用 JS

<img src="image.jpg" onerror="this.onerror=null;this.src='default.jpg'">

更新:工作版本

<script type="text/javascript"> 
   jQuery(window).load(function() { 
      jQuery("img").each(function(){ 
         var image = jQuery(this);             
         if(image.context.naturalWidth == 0 ||
         image.readyState == 'uninitialized'){    
            jQuery(image).unbind("error").attr(
                "src", "noimage.jpg"
            ); 
         } 
    }); 
}); 
</script>

Answer 1

jQuery 支持图像的错误事件——我不确定为什么你的内联示例不起作用，但是怎么样:

$('img').on('error', function() {
    $(this).attr('src', 'default.jpg');
});

这样还有一个好处就是不需要在每个元素中都添加。如果您的图片被盗链接，您的 .htaccess 解决方案将不起作用，因为您的站点不会提供这些图片。