Question

由于某些传统原因，我正在通过jQuery加载图像，并且在失败时，我需要错误代码（404或401）来说明为什么加载失败。我该如何实现？

var img = $('#test')
    .load(function() {
        // Do something.
        console.log(img);
    })
    .error(function(jqXHR, error, errorThrown) {  
    console.log(jqXHR);
    console.log(error);
    console.log(errorThrown);
       if(jqXHR.status && jqXHR.status==404)
       {
            alert("Something went wrong");
       }
    })
    .attr('src', "http://www.gravatar0.com/avatar/5e7856eb90f924b5cffb9fa75ca905ba?s=32&d=identicon&r=PG");

JsBin

Answer 1

您可以尝试使用Image类：

var image = new Image();

image.onload = function () {
  console.log('SUCCESS:');
  console.log(this);
};
image.onerror = function (e) {
  console.log('ERROR:');
  console.log(e);
};


image.src = 'http://www.gravatar0.com/avatar/5e7856eb90f924b5cffb9fa75ca905ba?s=32&d=identicon&r=PG';

覆盖onload函数以检查图像是否已准备就绪，并覆盖onerror函数以检查路径是否存在错误。

Answer 2

错误和加载方法已从3.0版中删除。因此，我建议您使用jQuery on方法并在其上绑定JavaScript事件：

var img = $('#test')
    .on('load', function() {
      ...
    })
    .on('error', function(msg, url, lineNo, columnNo, error) {
      ...
    })

您可以查看onerror和onload的文档

如何在Jquery中获取有关图像加载错误的错误代码？

2 个答案: