单击时使用 return/stop 函数

Question

目前即将使用 html 和 JavaScript 完成幻灯片放映。我的最后一个问题是创建需要使用 return 函数（我假设）或某种退出函数的停止按钮。它是一个自动运行s 的图像幻灯片，可以暂停、跳过图像、返回图像等。我想要停止按钮来终止自动运行功能并将图像设置回第一个默认图像。我已经设置了一个功能，我猜它是完全错误的，因为它不起作用。

HTML

  <td class="controls">

  <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>
  <button onClick="Exit();">Exit</button>



  </td>

</tr>

除最后一个按钮外，所有按钮都可用

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() {
interval = setInterval("changeImage(1)", 2000);

}

function pause(){
clearInterval(interval);
interval = null;
}

function Exit(){
return;
}

我没有完全理解 Exit 函数中的 return 语句，因为我看过的大多数示例运行满足 'if' 语句时的函数，而我希望我的程序在单击“停止”按钮时执行。谢谢

Answer 1

一个return语句只是退出它出现的函数，它不会导致其他事情停止。所以这个：

function Exit(){
return;
}

...与此具有相同的效果：

function Exit() { }

也就是说，该函数根本不执行任何操作。

I'd like the stop button to kill the autoRun function and set the image back to the first default image.

好的，让你的 Exit() 函数调用你的其他函数：

function Exit() {
  pause();            // this will stop the slideshow
  imageNumber = 0;    // reset to the first image
  changeImage(0);     // change to that image
}

单击时使用 return/stop 函数

Using a return/stop function on click

javascript

return

exit