autorefresh圖像保存第一個圖像

Question

我有一個相機，保存jpeg圖片，然後我上傳到我的網頁。即時通訊使用這個javsacript代碼做自動刷新：

function refreshCam() 
{ 
    document.getElementById("cameraImg").src = "cameraImg.jpeg?a=" + String(new Date().getMilliseconds()); 
    setTimeout("refreshCam()",500); 
} 

然而，第一個圖像我把彈出，在連續的圖像顯示器之間。 更糟糕的是，即使當我關閉相機以便不再保存新圖像時，顯示的圖片仍會繼續變化。我如何永久刪除此行爲？

Answer 1

爲了防止像「忽悠」，你可以使用這種技術：

function scheduleNextLoad() { 
    setTimeout("loadNextImage()", 500); 
} 

function loadNextImage() { 
    var image = new Image; 
    image.onload = function() { 
     var previousImage = document.getElementById("cameraImg"); 
     previousImage.parentNode.replaceChild(image, previousImage); 
     image.id = previousImage.id; 
     scheduleNextLoad(); 
    } 
    image.onabort = scheduleNextLoad; 
    image.onerror = scheduleNextLoad; 
    image.src = "cameraImg.jpeg?a=" + String(new Date().getMilliseconds()); 
} 

這樣做的是創建「就在身邊」的新img元素，讓它在後臺和之後的加載圖像圖片已加載將其與img交換在頁面中。結果是視覺更新瞬間發生。

將一個loadNextImage()火燒掉，讓球滾動。

順便說一句，getMilliseconds()電話並不是最好的選擇。您可能需要使用getTime()。