javascript - 3张图片幻灯片显示javascript代码，有什么问题？

Question

这是我当前的代码，它不能像我希望的那样工作。我希望它使用 javascript 代码在幻灯片放映中循环 3 张图片。我制作了文本/javascript文件并编写了html，问题出在此处，而不是其他文件中。

var step=1;
    function slideit()
    {
        document.images.slide.src = eval("image"+step+".src");
        if(step<2)
            step++;

        setTimeout("slideit()",2500);

        else if(step<3)
            step++;

        setTimeout("slideit()",2500);

        else
            step=1;

    }
    slideit();

感谢所有帮助！

Answer 1

这对你来说应该会更好一些，并且更容易阅读。

var step=1;
function slideit()
{
   document.getElementById("imageId").src = eval("image" + step + ".jpg");
   if(step<3)
       step++;
   else
        step=1;
   setTimeout(slideit, 2500);
}
slideit();

或者，如果您想使用@Besatamin 的回答：

var step=1;
function slideit()
{
   document.getElementById("imageId").src = eval("image" + step + ".jpg");
   if(step<3)
       step++;
   else
        step=1;
}
var sliderIntervalId = setInterval(slideit, 2500);

然后，您可以稍后通过以下方式停止它：

clearInterval(sliderIntervalId);

Answer 2

你的if/else陈述不正确。

您需要{}在 if 之后和 else 之前在代码周围放置大括号。

另一种写法可能是：

var step = 1;
function slideit()
{
    document.getElementById("imageId").src = eval("image" + step + ".jpg");
    if ( step < 3 ) step++;
    else step = 1;
    setTimeout("slideit()",2500);
}

Answer 3

而且，如果您希望滑动每一个，您应该使用 setInterval 而不是 setTimeout 因为 setTimeout 将汇总总超时并且只执行一次任务

Answer 4

我有一个与一些已经回答的解决方案类似的解决方案。请看一看。它在 Mac 上的 Safari 中对我有用。

我有一个图像文件夹，其中包含 3 张图像，即。1.jpg、2.jpg 和 3.jpg。您可以使用自己的图像并运行脚本。我觉得它有效。

html代码是<img name="slide" />

var step=1;
function slideit(){
document.images.slide.src = "images/"+step+".jpg";
if(step<3)
    step++;
else
    step=1;

setTimeout("slideit()",1000);   
}
slideit();