隱藏（）div不能在IE上工作，但在Chrome/firefox上工作

Question

這個想法是在圖像加載完成時顯示加載div並隱藏div。此代碼適用於Chrome/Firefox，但不適用於IE。任何想法？

HTML文件

//image 
<img src="image.php" class="loading"> 

//loading tag 
<div id="loaddiv"> 
    <div id="loading_float"><img src="src/img/loading.gif"> 
    <br>Loading.. 
    </div> 
</div> 

JS文件

var imgs_count=0, imgs_loaded=0; 
$(function(){ 
$loading = $('.loading'); 
if($loading.size()>0){ 
    $loading.load(function(){ 
     $('#loaddiv').hide(); 
    }); 
}else{ 
    $('#loaddiv').show(); 
} 
}); 

Answer 1

你不能可靠地使用JavaScript來onload事件處理函數附加到在頁面的HTML的圖像。這是因爲圖像可能已經加載之前，您的JavaScript甚至有機會運行的頁面DOM（和它引用的圖像）開始加載之前JavaScript有機會運行並找到這些非常DOM元素。一旦圖像在瀏覽器緩存中，IE中的問題就會變得更糟，因爲IE在這種情況下幾乎立即加載圖像。

有兩個可能的變通：

1. 指定與onload屬性的實際HTML onload處理。
2. 請勿將圖像放入頁面的HTML中。使用javascript動態創建它們，並在圖像對象上設置.src屬性之前分配onload處理程序，以確保不會錯過onload事件。
3. 當您的JavaScript運行並且在您安裝負載處理程序之前，請檢查圖像是否已經加載並相應地執行。