jquery - 在谷歌浏览器中获取图像大小未定义

Question

我的 html 中有几个图像标签和 div，如下所示。

我的要求是计算每个图像的高度 * 宽度，如果高度 * 宽度 <5000，则执行以下操作。1）删除相应的div 2）删除相应图像的“captify”类

为此，我尝试了以下脚本来处理 google chrome，因为我已经设法使用其他方法为 IE 和 firefox 工作。

$('img[class = "captify"]').each(function(){

var $that = $(this),
picRealWidth = 0,
picRealHeight = 0,
imgSize = 0,
dvHiResCaption = null,
src = $that.attr( 'src' ),
rel = $that.attr( 'rel' );

// creating a clone in memory
$('<img/>').attr('src', src)
.load(function(){
picRealWidth = parseInt( this.width );
picRealHeight = parseInt( this.height );
}, function(){
// called once the load is complete
imgSize = picRealWidth * picRealHeight;

if( imgSize < 5000 ){
dvHiResCaption = '#' + rel;
$(dvHiResCaption).remove();
$that.removeClass( 'captify' );
}
});
});

任何人都可以帮我解决这个问题。提前谢谢了

Answer 1

试试这个：

$('img.captify').each(function(i,img){
    img.onload = function() {
        if ((this.width * this.height) < 5000) {
            $('#' + $(this).attr('rel')).remove();
            $(this).removeClass('captify');
        }
    }
});​

Answer 2

jsfiddle没有这样的方法。this 内部加载函数不是 jQuery 对象，而是 JavaScript HTMLElement。利用：

.....
picRealWidth = $(this).width( ); // return integer value
picRealHeight =  $(this)..height( );  // return integer value
.....

Answer 3

使用 $(this).width, $(this).height

$('<img/>').attr('src', src)
.load(function(){
picRealWidth =$(this).width();
picRealHeight = $(this).height();
.......