jquery - jQuery检查图像是否存在

Question

嗨，我正在尝试在网站的不同部分显示不同的图像，但如果图像不存在，我需要显示默认图像。

这是我的代码：问题是检查 img 宽度，但总是

jQuery(document).ready(function () {

    var $pathname = window.location.pathname;
    $item = 'http://www.lotus-nascita.it/images/headers-hover/corsi-preparto.jpg';
    if ($pathname == '/') {
        $pathname = $pathname + 'home';
        $item = 'http://www.lotus-nascita.it/images/headers-hover' + $pathname + '.jpg';

    }
    var img = new Image();
    img.onload = function () {}
    img.src = $item;
    if (img.height != 0) {

        $item = 'http://www.lotus-nascita.it/images/headers-hover' + $pathname + '.jpg';
    }

    jQuery('#header').fadeOut('fast', function () {
        jQuery('#header').css({
            "background": 'url("' + $item + '")'
        });
        jQuery('#header').fadeIn('slow');

    });
});

Answer 1

我会在香草中尝试这样的事情：

<img src="image.gif" onerror="this.src = 'default.gif'">

或 jQuery：

$(img).error(function() {
   $(this).attr("src","default.gif");
}).attr("src",$item);

Answer 2

尝试

var $myImg = $("<img>").attr("src", $item);
if($myImg.height != 0) { ... }

Answer 3

高度始终为零，因为您必须等待图像加载才能具有高度？

var item = 'http://www.lotus-nascita.it/images/headers-hover' + $pathname + '.jpg';
var img  = new Image();

img.onload = function () {
  if (this.height === 0) {
      item = 'http://www.lotus-nascita.it/images/headers-hover/corsi-preparto.jpg';
  }
}
img.src = item;