JavaScript Noob here。在javascript中動態改變圖像
我要顯示這樣的動態改變的圖像效果: http://dotsignals.org/google_popup.php?cid=202 (如果該網頁無法顯示變幻的圖像,單擊任一攝像機在http://dotsignals.org)
我已經研究過的代碼,有一些問題:
1.網站使用setImage
和refreshSetImage
初始化和刷新圖像的動態變化效果。 Math.random在這裏有什麼用處?我知道這是一種在不同時間區分圖像的方法。但它是如何工作的?後端如何迴應?
2.與第一個問題相關。 refreshSetImage的機制是什麼?我沒有看到從服務器請求數據的任何跡象。它是否發送「GET」?它如何刷新圖像?
function setImage(imageID){
var currentImage = imageID;
document.getElementById(currentImage).src ='http://207.251.86.238/cctv9.jpg'+'?math=';
refreshSetImage();
}
function refreshSetImage() {
document.images["myCam"].src = 'http://207.251.86.238/cctv9.jpg'+'?math='+Math.random();
setTimeout('refreshSetImage()',1000);
}
function ScaleSize(imageID) {
var elem = document.getElementById(imageID);
elem.style.width = 500;
elem.style.height = 300;
}
3.如何設計後端? 4.現在我想在我自己的項目中使用這兩個函數。我想在setImage
和refreshSetImage
函數中添加camID
的參數,因此圖像的src
將更改爲類似於:。 camID
是標識不同相機的字符串。我將其更改爲:
function refreshSetImage(camID) {
document.images["myCam"].src = 'http://207.251.86.238/'+camID+'.jpg'+'?math='+Math.random();
setTimeout('refreshSetImage(camID)',1000);
}
function setImage(imageID,camID){
var currentImage = imageID;
document.getElementById(currentImage).src = 'http://207.251.86.238/'+camID+'.jpg'+'?math=';
refreshSetImage(camID);
}
並且出現錯誤:Uncaught ReferenceError: camID is not defined VM132:1
。圖像也沒有變化。我不知道是什麼問題。什麼是VM132:1
?
感謝
的的Math.random是確保你請求圖像是不是從高速緩存。您添加一個「唯一」的關鍵字以確保瀏覽器實際嘗試獲取新圖像。 如何設計後端:好問題...問原始開發者.. 如果你想製作自己的後端..也可以問問他們:這可能是他們限制訪問他們的視頻循環,並且*可能是爲什麼你得到一個錯誤(但這只是一個猜測( – Leon
http://207.251.86.238/cctv9.jpg?time=1 http://207.251.86.238/cctv9.jpg?time=2 params時間或數學,如果重新加載圖像..並在你的問題,沒有定義camid是一個錯誤,當你沒有在你的變量中賦值 – Cuchu
我通過定期從後端請求數據使用JQuery get() – Keying