存在JQuery检查图像

时间:2013-05-16 19:49:16

标签: jquery image onload

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

这是我的代码:问题是检查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');

    });
});

3 个答案:

答案 0 :(得分:1)

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

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

或jQuery:

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

答案 1 :(得分:0)

尝试

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

答案 2 :(得分:0)

高度始终为零,因为您必须等待图像在高度之前加载?

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;