加載圖像時顯示處理JQuery/Javascript

Question

我有一個圖像被編輯並重新載入一個新的查詢字符串，以確保它可以使用緩存副本。由於Image已經有一個圖像源，當我改變圖像用戶仍然看到舊圖像，如果圖像很大，他可能會認爲它沒有處理。有什麼方法可以顯示用戶該圖像正在加載嗎？

Answer 1

的加載信息，請更換初始圖像：

function SomeImageChangeFunction() 
{ 
    $('ProcessingImage').parent().text('loading...'); 
    $('ProcessingImage').attr('href', 'newURL'); 
} 

加載可能是一個GIF動畫或任何你想要的。

Answer 2

你有jQuery嗎？

在更改新圖像時，隱藏它並在同一位置顯示包含加載圖像/文本的div。然後，在載入的圖像中，重新顯示圖像並隱藏div。

<img id="loadingimg" src="loading.gif"><img id="theimage" src="whatever-1.jpg" onload="imgloaded();" onchange="imgchanged();"> 

function imgchanged() { 
    $('#theimage').css('display', 'none'); 
    $('#loadingimg').css('display', 'inline'); 
} 

function imgloaded() { 
    $('#loadingimg').css('display', 'none'); 
    $('#theimage').css('display', 'inline'); 
}