关于chrome,firefox中img.width=0，img.height=0的解决方法

dn001 2014-04-25 22:38:35

今天修改网站的上传头像时，谷歌浏览器中放大缩小图片，图像消失的bug。

调试时发现动态处理图片时有问题：

[javascript]view plaincopy
varimg;=;newImage();;;;
img.src;=;$("#xxx").attr("src");;;
var_width;=;img.width;;;
var_height;=;img.height;;;
img;=;null

_width=0，_height=0

上网搜了下，发现是图片未加载完造成的。

解决方法：

[javascript]view plaincopy
functionloadImage(url,;callback);{;;
varimg;=;newImage();;//创建一个Image对象，实现图片的预下载
img.src;=;url;;;
if(img.complete);{;//;如果图片已经存在于浏览器缓存，直接调用回调函数
callback.call(img);;;
return//;直接返回，不用再处理onload事件
};;
img.onload;=;function();{;//图片下载完毕时异步调用callback函数。
callback.call(img);//将回调函数的this替换为Image对象
};;
} ;