加载图像时运行回调

Question

我想知道如果查看图像的height属性是查看它是否已加载的可靠方法。

比方说，我得的图像的参考，像这样：

var img = document.getElementById('myImg'); 

如果我想运行一些代码，依靠在图像上加载，我可以把它放在一个回调，并运行img.onload = myCallback;。

但是，如果图像已经加载之前此代码运行，则回调将不会执行。

这是一个可能的解决方案：

if (img.height && img.height > 0) { 
    myCallback(); 
} 
else { 
    img.onload = myCallback; 
} 

换句话说：运行myCallback现在如果图像已被加载，否则等到它的加载。

但我有一种感觉，这个代码可能是脆弱的......它会在所有情况下工作吗？有没有更安全或更优雅的做法？

Answer 1

您正在寻找complete住宅。不过，我不认为这可以可靠地工作在所有的Firefox版本，所以这是很好的补充您的身高检查备份：

if (img.complete) { 
    myCallback(); 
} else if (img.height && img.height > 0) { 
    myCallback(); 
} else { 
    img.onload = myCallback; 
}