Question

我有一个页面上有很多图像。我的图像是从外部服务器加载的。通常这个服务器加载太慢，所以我的页面保持加载，直到外部服务器再次开始运行。我希望在外部服务器关闭时从我的地方加载一个空白图像。

有没有办法做这样的事情？

if ($("img").load=false) {
 $("img").src="cantload.png";
}

非常感谢你，提前！

Answer 1

如果你正在使用jquery，那么这段代码就会在图像绑定之前发生。

$("img").error(function() {
    alert("Could not load image");
});

如果没有，那么你可以做一些这样的事情，它总能奏效，但需要在每张图片上：

<img src="image.gif" onerror="alert('Could not load image.')">

Answer 2

如果你想在元素已经在DOM中之后激活这个功能，你可以使用这样的东西。

var defaultSource = 'cantload.png';

$('img').each(function() {
    var originalSource = $(this).attr('src');

    $(this)
        .attr('src', defaultSource)
        .error(function(){
            $(this).attr('src', defaultSource );
        })
        .attr('src', originalSource);
});

上面的代码将绑定内部函数来处理图像的加载错误，然后将它们全部重新加载。已经重新加载的图片实际上不会再次重新加载，但是那些有错误的图片会触发错误处理程序并将source attribute更改为cantload.png

jsFiddle Demo

检查是否可以加载图像

2 个答案: