【问题标题】:Using a return/stop function on click单击时使用返回/停止功能
【发布时间】:2016-09-06 02:05:43
【问题描述】:

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

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”语句时运行该函数,而我希望在停止按钮时执行该函数点击。谢谢

【问题讨论】:

    标签: javascript return exit


    【解决方案1】:

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

    function Exit(){
    return;
    }
    

    ...效果和这个一样:

    function Exit() { }
    

    也就是说,该函数根本不做任何事情。

    我想要停止按钮来终止自动运行功能并将图像设置回第一个默认图像。

    好的,让你的 Exit() 函数调用你的其他函数:

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

    【讨论】:

    • 啊,我现在明白了,好多了。也可以理解,非常感谢
    猜你喜欢
    • 2023-03-19
    • 2023-03-21
    • 2012-01-18
    • 1970-01-01
    • 1970-01-01
    • 2019-05-12
    • 1970-01-01
    • 2011-10-30
    • 2018-03-18
    相关资源
    最近更新 更多