javascript - 我的脚本无法仅循环 5 个图像一次

标签 javascript image loops

我只需要循环浏览几张图像(这里是 5 个)一次。每张图片应展示 20 秒,然后转到另一张图片,或者参与者点击图片! 然而,这个 scipr 似乎不起作用。有没有简单的方法可以做到这一点?

<html>
       <head>
          <title>Practice1</title>

          <script type="text/javascript">

                      function displayNextImage() {
                        for(var x=0; x<images.length; x++){
                          document.getElementById("img").src = images[x];
                        }
                      }


              function startTimer() {
                  setTimeout(displayNextImage, 20000);
              }

             var images = [], 
              images[0] = "S1b.jpg";
              images[1] = "S2b.jpg";
              images[2] = "S3b.jpg";
              images[3] = "S4b.jpg";
              images[4] = "S5b.jpg";

          </script>


    </body>
                <button onload="startTimer()" onclick="displayNextImage()">
                  <img id="img">
            </button> 


       </body>
    </html>

最佳答案

这里的语法无效:

var images = [], //HERE!!!!!
          images[0] = "S1b.jpg";
          images[1] = "S2b.jpg";
          images[2] = "S3b.jpg";
          images[3] = "S4b.jpg";
          images[4] = "S5b.jpg";

images[index] 不是一个新变量,它是对数组的添加,因此用分号替换该逗号:

var images = [];
          images[0] = "S1b.jpg";
          images[1] = "S2b.jpg";
          images[2] = "S3b.jpg";
          images[3] = "S4b.jpg";
          images[4] = "S5b.jpg";

现在,您的脚本将循环该数组并以极快的速度分配图像源。仅供引用,您可能甚至不会注意到它循环

关于javascript - 我的脚本无法仅循环 5 个图像一次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26529359/

相关文章:

image - 在 HTML5/JavaScript 中将图像包裹在圆柱形对象周围

java - 使用while暂停整个java程序有危险吗?

c - 数组的总和

php - 每 3 项和 4 项交替

iphone - iOS - 选择图像区域的最佳方式

html - 用base64编码图像有什么效果?

C 循环未正确迭代字符串

javascript - jquery 新手 : how to efficiently do multiple actions on same DOM element?

javascript - 正则表达式模式不返回匹配项

javascript - 将 !important 应用于所有 JS 样式的元素。好主意还是不好?