使用PHP和JavaScript进行自动幻灯片放映

所以基本上我制作了一个PHP程序，可以从文件夹中拍摄照片，并将其放入图库中的“幻灯片”中。PHP代码给出了从“1”开始的图像id，以此类推

现在使用JavaScript，我希望它每2,5秒自动切换一次图片。它实际上按照我在Firebug脚本中希望的方式运行，但在浏览器中什么也没发生。我已经在HTML正文的底部发布了我的JavaScript链接，但没有任何帮助

任何帮助都将不胜感激

<div id="gallery" class="grey">
    <h3>Gallery</h3>
    <div id="slideshow">
        <?php
    $path = "./img/gallery";
    $all_files = scandir($path);
    $how_many = count($all_files);
        for ($i=2; $i<$how_many;$i++) {
            $kubi=$i - 1;
            echo "<img src=\"./img/gallery/$all_files[$i]\" id= \"$kubi\"/>";
        }
    ?>
    </div>
</div>

画廊

JavaScript代码：

var picture = document.getElementById("1");
var i = 0;
function rotateImages() {
    while (i < document.getElementById("slideshow").childNodes.length) {
        picture.style.display = "none";
            picture = picture.nextSibling;
            picture.style.display = "inline";
            i++;
    };
};

window.onload = function(){
document.getElementById("1").style.display = "inline";
setInterval(rotateImages(), 2500);
};  

var picture=document.getElementById（“1”）；
var i=0；
函数rotateImages（）{
while（i

所发生的事情是，始终使用相同的第一个元素图片，隐藏它，然后显示第二个图片，它实际上不会遍历所有图片

在代码中，picture始终是第一个元素，next始终是第二个元素

此外，它不应该是while循环，因为回调被调用一次以更改图片，所以将其更改为if，并在它通过总元素数时重置为第一张图片

应该是：（Javascript）

---

我脑子里一直在想这个问题，但我自己却想不出来。你完全正确。谢谢你的代码和帮助。但是由于某些原因，代码只是在window.onload部分跳过。它实际上并不运行内部的代码。你知道为什么会这样吗？更改setInterval（rotateImages（），2500）；设置间隔（旋转图像，2500）。在函数之后使用（）将调用它，但需要发送函数对象本身。我还编辑了答案。不管怎样，我都能找到答案。我刚刚删除了setInterval中rotateImages之后的“（）”。非常感谢你的帮助！哈哈，刚刚看到你的评论，真是恰到好处；）

var firstPicture = document.getElementById("1");
var picture = firstPicture ;
var i = 0;
function rotateImages() {
    // hide current element
    picture.style.display = "none";

    // choose who is the next element
    if (i >= document.getElementById("slideshow").childNodes.length) {
        i = 0;
        picture = firstPicture;
    } else {
        picture = picture.nextSibling;
    }

    // show the next element
    picture.style.display = "inline";
    i++;
};

window.onload = function(){
var curImg = document.getElementById("1").style.display = "inline";
setInterval(rotateImages, 2500);
};