Question

我想在网格中显示图像。但如果图像不存在我想显示无image.png。但目前如果图像不存在，它将在控制台上显示错误

"GET http://localhost/images/image.png 404 (Not Found)".

如果图像不存在，我不想要这个错误。请帮帮我，我该怎么办.. 这是我的代码。

var image = $('<img src="/images/image.png" />');
            if (image.attr('width') > 0)
                return '/images/No_image.png';
            else
                return '/images/image.png';

Answer 1

要实现此目的，您可以使用error()元素的img事件。如果该事件被引发，则您知道图像未成功加载，无论是服务器错误还是404.在这种情况下，您可以将src属性更改为占位符。试试这个：

$('<img src="/images/image.png" />').error(function() {
    $(this).attr('src', '/images/No_image.png');
});

Answer 2

您可以使用以下代码检查图像是否存在

function isImageExists(imgSrc, callBackAfterCheck) {
   var img = new Image();
   img.onload = function() { callBackAfterCheck(true) };
   img.onerror = function() {callBackAfterCheck(false) };
   img.src = imgSrc;
}

function callBackAfterCheck(status){
   if(status == true){
    //do your stuff here
    console.log('image Exist');
   }else{
    //do your stuff here
    console.log('image not Exist');
   }
}

 var imageUrl = 'your_image_url';
 isImageExists(imageUrl, callBackAfterCheck);

如果不存在则出现图像错误

2 个答案: