javascript - 使用jQuery修改样式时，能否捕获到HTTP错误？

Question

如果我使用jQuery来设置页面的背景图像，如下所示:

$('body').css({
    "background-image": 'url(' + myImageUrl + ')'
});

如何检测和处理可能从图像URL返回的HTTP错误(500、503、404等)？

我确实找到了一个注册回调的jQuery jQuery .error()方法，但在1.8中已将其标记为已弃用，而没有指示应该用什么代替它。 (无论是否赞成，我似乎也无法使其正常工作。)

根据下面的评论和答案，我尝试了这种变体，它似乎奏效了，但答案却不尽人意。有什么不好的理由吗？

$('<img>').error(function(obj) {
    alert('error');
}).load(function() {
    $('body').css({
        "background-image": 'url(' + myImageUrl + ')'
    });
}).attr('src', myImageUrl);

Answer 1

尝试这个

jQuery的

Live Demo

var $image = $("<img />");
$image.on("error",function() { 
  $('body').css({
    "background-image": 'url(defaultimage.jpg)'
  });
}).on("load",function() {
  $('body').css({
    "background-image": 'url(' + myImageUrl + ')'
  });
}).attr("src",myImageUrl);

JavaScript:

var image = new Image();
image.onerror=function() { 
  document.body.style.backgroundImage="url(defaultimage.jpg)"
}
image.onload=function() {
  document.body.style.backgroundImage="url("+myImageUrl+")"
}
image.src=myImageUrl;