之前的图像大小为DOM

问题描述

| 在将图像放入DOM之前如何获得图像大小？

var imgLoad = $(\"<img />\");
$(imgLoad).attr(\"src\",Imagegallery.ImagesList[index] + \"?\" + new Date().getTime());
$(imgLoad).unbind(\"load\");
$(imgLoad).bind(\"load\",function () {

   // Get image sizes
   alert(imgLoad.width()); // RETURN 0

});

    

解决方法

使用

imgLoad[0].width

和

imgLoad[0].height

代替，或使用

this

代替

imgLoad

：

var imgLoad = $(\"<img />\");
imgLoad.attr(\"src\",ImageGallery.ImagesList[index] + \"?\" + new Date().getTime());
imgLoad.unbind(\"load\");
imgLoad.bind(\"load\",function () {

   // Get image sizes
   alert(this.width);

});

  工作演示：http://jsfiddle.net/7twNk/ 之所以起作用，是因为浏览器在下载图像时会填充元素的

height

/

width

属性。另一方面，jQuery会获取元素的实际可见尺寸-当未显示元素时，该尺寸始终为0。 请注意，您不必将

imgLoad

换成

$()

，因为它已经是jQuery对象。     ,创建新图像时，.width将为您提供未渲染图像的原始尺寸，而.width（）是jQuery方法，在将图像插入DOM中之前不会返回任何值。 用普通的旧JS；

var i = new Image()
i.src = \'blah.gif\'
var h = i.height
var w = i.width

会给你一个真实的价值