簡單的Javascript圖像旋轉不正常循環

Question

這是一個簡單的旋轉腳本，無法正常工作。它有四個警報：currentImage，1，2和3.在FF中，它會經歷四次警報並停止。在Chrome中，它經歷了五次。該圖片在兩個瀏覽器中只會更改一次。

function rotateImages(currentImage, id) { 
    var dir = "/images/"; 
    var a = new Array("coolspider1.jpg", "coolspider2.jpg", "coolspider3.jpg"); 

    var b = document.getElementById(id); 

    if(currentImage >= a.length){ 
    currentImage=0;} 

//loop stops here in ff 

alert(a[currentImage]); 

//loop stops here in chrome 

b.src = dir + a[currentImage]; 
alert(1); 

currentImage++; 
alert(2); 

rotator = window.setTimeout("rotateImages(" + currentImage + "," + id + ")",500); 
alert(3); 
} 

Answer 1

有很多的問題在這裏：

• 您正在訪問DOM每次太多用的getElementById。而是傳遞元素。
• 您每次都創建相同的數組。 var a = new Array(...)可以創建一次。
• 你永遠不會分配給currentImage
• 您正在使用的setTimeout古怪，而不是一個簡單的循環，for(i;etc..) setTimeout(func, 500 + i*500, params...)
• 您正在使用警報的東西...不知道

替換：

window.setTimeout("rotateImages(" + currentImage + "," + id + ")",500); 

附：

window.setTimeout(rotateImages,500, currentImage, id); 

setTimeout需要...參數的可選參數。