Question

我不确定我将如何添加按钮，请帮助我需要它来停止并启动幻灯片放置，谢谢我已经无法让它工作大约两个小时我刚刚开始编码，这是唯一的我坚持不懈，再次感谢。

<html>
<head>
<script type="text/javascript">

var slideimages = new Array() 
slideimages[0] = new Image() 
slideimages[0].src = "https://www.missionmanager.com/wp-content/uploads/2015/08/number-1-199440.jpg" 
slideimages[1] = new Image()
slideimages[1].src = "https://www.missionmanager.com/wp-content/uploads/2015/08/red-number-2.jpg"
slideimages[2] = new Image()
slideimages[2].src = "https://www.missionmanager.com/wp-content/uploads/2015/08/red-number-3.jpg"

</script>
</head>
<body>
<img src="" id="slide" width="150" height="260" />

<script type="text/javascript">

var step=0

function slideit(){


 document.getElementById('slide').src = slideimages[step].src
 if (step<2)
  step++
 else
  step=0

 setTimeout("slideit()",2500)
}

slideit()

</script>
</body>
</html>

Answer 1

你走了：

我的更改摘要

在HTML中添加了2个按钮，用于启动和停止幻灯片放映
添加了一个start（）函数，在单击开始按钮而不是自动调用时调用slideit（）函数
添加了一个变量myTimer以保留计时器实例
添加了一个stop（）函数，用于在单击停止按钮时清除计时器

<html>

<head>
  <script type="text/javascript">
    var slideimages = new Array()
     slideimages[0] = new Image()
     slideimages[0].src = "https://www.missionmanager.com/wp-content/uploads/2015/08/number-1-199440.jpg"
    slideimages[1] = new Image()
     slideimages[1].src = "https://www.missionmanager.com/wp-content/uploads/2015/08/red-number-2.jpg"
    slideimages[2] = new Image()
     slideimages[2].src = "https://www.missionmanager.com/wp-content/uploads/2015/08/red-number-3.jpg"
  </script>
</head>

<body>
  <img src="" id="slide" width="150" height="260" />
  <button onclick="start()">Start</button>
  <button onclick="stop()">Stop</button>


  <script type="text/javascript">
    var step = 0;
    var myTimer = null;

    function slideit() {


      document.getElementById('slide').src = slideimages[step].src
      if (step < 2)
        step++
        else
          step = 0

      myTimer = setTimeout("slideit()", 2500)
    }

    function start() {
      slideit();
    }

    function stop() {
      if (myTimer != null)
        clearTimeout(myTimer);
    }
  </script>
</body>

</html>

如何为此添加开始和停止按钮？

1 个答案: