我如何才能使此幻燈片代碼片段無限循環（我當前的代碼無法正常工作，並且我不知道自己在哪里犯錯誤）

Question

我有一個包含以下代碼的JavaScript文件：

var slideArray = new Array();
slideArray[0] = new Image();
slideArray[0].src = "images/slide/1.jpg";
slideArray[1] = new Image();
slideArray[1].src = "images/slide/2.jpg";
slideArray[2] = new Image();
slideArray[2].src = "images/slide/3.jpg";
slideArray[3] = new Image();
slideArray[3].src = "images/slide/4.jpg";
slideArray[4] = new Image();
slideArray[4].src = "images/slide/5.jpg";

var step = 0;

function slideit() {
    if (!document.images)
        return;
    document.getElementById('slide').src = slideArray[step].src;
    if (step < 5)
        step++;
    else
        step = 0;
    setTimeout("slideit();", 4500);
}

slideit();

這段代碼從我的目錄中獲取所有圖像，並將它們的路徑設置為頁面上的圖像元素。

之后，我在代碼中調用一個函數slideit（），該函數遍歷所有圖像，然后每隔4500毫秒通過setTimeout（）函數進行一次調用，以遞歸方式對其進行調用。

問題是，在遍歷我的4張圖像后，它不會再次打開，並且它不顯示最后一張，而且我也不知道如何解決此問題。 歡迎提供任何代碼示例建議，謝謝！

Answer 1

@fuyushimoya幫助我解決了這個問題。 似乎在函數內部，我正在檢查step變量以查看其是否大於5，這使該函數無法正常運行...一切工作正常，並且step不再獲得值5它超出document.getElementById('slide').src = slideArray[step].src; 如他所說。

非常感謝@fuyushimoya在這一方面幫助我！ 萬分感謝！

Answer 2

您可以使用數組的長度進行測試，例如此處使用提醒操作符。

 function slideit() { document.getElementById('slide').src = slideArray[step].src; step++; step %= slideArray.length; } var step = 0, slideArray = new Array(); slideArray[0] = new Image(); slideArray[0].src = "http://lorempixel.com/100/50/"; slideArray[1] = new Image(); slideArray[1].src = "http://lorempixel.com/100/51/"; slideArray[2] = new Image(); slideArray[2].src = "http://lorempixel.com/100/52/"; slideArray[3] = new Image(); slideArray[3].src = "http://lorempixel.com/101/50/"; slideArray[4] = new Image(); slideArray[4].src = "http://lorempixel.com/102/50"; if (document.images) { slideit(); setInterval(slideit, 4500); } 

 <img id="slide" width="100" height="50" />