加載圖像時運行回調

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; 
}