Question

我知道经常会问这个问题，但我无法复制代码。我希望图像在一段时间后改变。我想我犯了很多错误的编码错误。以下是我的代码：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>test</title>
        <link rel="stylesheet" type="text/css" href="/css/styles.css">
    </head>
    <body>
        <img id="image" src="foto1.jpg">

        <script type = "text/javascript">
            var image=document.getElementById("image");

            function volgendefoto() {
                if (images==0) {
                    image.src="foto2";
                }

                if (images==1) {
                    image.src="foto2";
                }
                if (images==3) {
                    image.src="foto1";
                }
            }

            function timer(){
                setInterval(volgendefoto, 3000);
            }

            var images= [], x = -1;
            image[0]="foto1.jpg";
            image[1]="foto2.jpg";
            image[2]="foto3.jpg";
        </script>
    </body>
</html>

提前感谢您的帮助，

碧玉

Answer 1

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>test</title>
        <link rel="stylesheet" type="text/css" href="/css/styles.css">
    </head>

    <body>
        <img id="image" src="foto1.jpg">

        <script type = "text/javascript">
            var image = document.getElementById("image");
            var currentPos = 0;
            var images = ["foto1.jpg", "foto2.jpg", "foto3.jpg"]

            function volgendefoto() {
                if (++currentPos >= images.length)
                    currentPos = 0;

                image.src = images[currentPos];
            }

            setInterval(volgendefoto, 3000);
        </script>
    </body>
</html>

Answer 2

您没有创建间隔，永远不会执行计时器。这是一个循环你的图片，假设你的第一张图片是预装的图片（例如：images[0] === image.src页面加载）：

  const image=document.getElementById("image");
  let images= ["foto1.jpg","foto2.jpg","foto3.jpg"], i = 0;

  function volgendefoto() {
      i<images.length?i+=1:i=0; 
      image.src=images[i];
  }
  setInterval(volgendefoto, 3000);

更改计时器上的图像，

2 个答案: