6

这是检测损坏图像的示例
http://maisonbisson.com/blog/post/12150/detecting-broken-images-in-javascript/

但是是否可以检测到损坏的背景图像？
例如：

<div style="background-image:url('http://myimage.de/image.png');"></div>
4

2 回答 2

5

我认为您不需要 jQuery 或 javascript 来告诉您链接是否损坏。在 Firefox 中使用 Firebug，它将解决您的大部分问题：

https://addons.mozilla.org/en-us/firefox/addon/firebug/

编辑： 既然我知道它是用于自动修复，我很快就看了一下并想出了这个：

var imageURLs = $('div');
imageURLs.each(function(index, element){
    var imageURL = $(element).css('background-image').replace('url("', '').replace('")', '');
    if (imageURL != "none"){
        $.ajax({
           url: imageURL,
           type: 'HEAD',
           error: function(){
              //error handling for broken image url
           }
        });
    }
});

加载后将其添加到您的页面，它将扫描所有 div 元素以查找任何损坏的 css 背景图像。可能有更好或更快的方法来做到这一点，但这是一般的想法。

编辑 2：当我测试脚本时，我注意到 .css('background-image') 返回一个字符串，其中包含图像 url 的 "url()"。这导致所有 url 上的 ajax 调用失败。我更改了它并仅对具有 css 背景的元素执行 ajax 调用。上面的代码现在可以完美运行了！:D

于 2012-10-22T09:32:12.167 回答
1

您是否可以控制服务器上的“404 not found”页面？在这种情况下，您可以将其指向在请求的 URL 中查找 .jpg/.png/.gif 并相应记录的脚本，然后将 404 页面输出给用户。

于 2012-10-22T13:39:55.460 回答