慕课网

第1章系好安全带,准备启航
编程：1-1 让你认识JS
编程：1-2 编程练习

第10章编程挑战
编程：10-1 编程挑战

取消计时器clearTimeout()

setTimeout()和clearTimeout()一起使用，停止计时器。

语法:

clearTimeout(id_of_setTimeout)

参数说明:
id_of_setTimeout：由 setTimeout() 返回的 ID 值。该值标识要取消的延迟执行代码块。

下面的例子和上节的无穷循环的例子相似。唯一不同是，现在我们添加了一个 "Stop" 按钮来停止这个计数器：

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
  var num=0,i;
  function timedCount(){
    document.getElementById('txt').value=num;
    num=num+1;
    i=setTimeout(timedCount,1000);
  }
    setTimeout(timedCount,1000);
  function stopCount(){
    clearTimeout(i);
  }
</script>
</head>
<body>
  <form>
    <input type="text" id="txt">
    <input type="button" value="Stop" onClick="stopCount()">
  </form>
</body>
</html>

任务

补充右边编辑器第16行，完成取消计时器函数。

补充右边编辑器第23行，点击Start按钮后，开始计数。

补充右边编辑器第24行，点击Stop按钮后，停止计数。

?不会了怎么办: 要取消setTimeout()计时器，要获取它的返回值ID

使用clearTimeout()取消，参数是setInterval()计时器的返回值ID

写笔记

公开笔记

提交

全屏

请验证，完成请求

由于请求次数过多，请先验证，完成再次请求

8-6 取消计时器clearTimeout()

取消计时器clearTimeout()

任务

写笔记

收藏课程后，能更快找到我哦～