Question

我之前得到了一些帮助，为我的图片幻灯片创建了一个暂停按钮，它似乎正在努力到某一点。

幻灯片播放自动运行＆＃34;开始＆＃34;单击按钮。这工作正常，直到我玩代码以使暂停按钮工作。现在autoRun函数在页面加载时启动。有没有办法阻止这种情况发生，并且当我点击我的开始按钮时它才刚刚开始？干杯

HTML

  <button onClick="autoRun()">Start</button>
  <button onClick="changeImage(-1); return false;">Previous Image</button>
  <button onClick="pause();">pause</button>
  <button onClick="changeImage(1); return false;">Next Image</button>

的JavaScript

var images = ["HGal0.jpg", "HGal1.jpg", "HGal2.jpg", "HGal3.jpg", "HGal4.jpg", "HGal5.jpg", "HGal6.jpg", "HGal7.jpg", "HGal8.jpg", "HGal9.jpg", "HGal10.jpg", "HGal11.jpg", "HGal12.jpg", "HGal13.jpg", "HGal14.jpg", "HGal15.jpg"];
var interval = setInterval("changeImage(1)", 2000);
var imageNumber = 0;
var imageLength = images.length - 1;

function changeImage(x) {
imageNumber += x;
// if array has reached end, starts over
if (imageNumber > imageLength) {
    imageNumber = 0;
}
if (imageNumber < 0) {
    imageNumber = imageLength;
}

document.getElementById("slideshow").src = images[imageNumber];

return false;
}

function autoRun() {
setInterval("changeImage(1)", 2000);

}

function pause(){
clearInterval(interval);
}

Answer 1

请删除以下代码行，如果有帮助请告诉我 var interval = setInterval（＆＃34; changeImage（1）＆＃34;，2000）;

Answer 2

将interval声明为变量，在interval

中定义autoRun

＆＃13;

<button onClick="autoRun()">Start</button>
<button onClick="pause(); changeImage(-1); autoRun();">Previous Image</button>
<button onClick="pause();">pause</button>
<button onClick="pause(); changeImage(1); autoRun();">Next Image</button>
<script>
  var images = ["HGal0.jpg", "HGal1.jpg", "HGal2.jpg", "HGal3.jpg", "HGal4.jpg", "HGal5.jpg", "HGal6.jpg", "HGal7.jpg", "HGal8.jpg", "HGal9.jpg", "HGal10.jpg", "HGal11.jpg", "HGal12.jpg", "HGal13.jpg", "HGal14.jpg", "HGal15.jpg"];
  var interval;
  // = setInterval("changeImage(1)", 2000);
  var imageNumber = 0;
  var imageLength = images.length - 1;

  function changeImage(x) {
    imageNumber += x;
    // if array has reached end, starts over
    if (imageNumber > imageLength) {
      imageNumber = 0;
    }
    if (imageNumber < 0) {
      imageNumber = imageLength;
    }

    //document.getElementById("slideshow").src = 
    console.log(images[imageNumber]);

    return false;
  }

  function autoRun() {
    interval = setInterval("changeImage(1)", 2000);
  }

  function pause() {
    clearInterval(interval);
    interval = null;
  }
</script>

＆＃13;

停止自动运行功能，直到＆＃34;开始＆＃34;点击按钮

2 个答案: