Window clearTimeout() 方法

实例

阻止使用 setTimeout() 设置的函数执行:

<!DOCTYPE html>
<html>
<body>
<p>等待 3 秒钟后，单击第一个按钮以弹出警告信息框 "Hello"。</p>
<p>单击第二个按钮以阻止执行第一个函数。（您必须在 3 秒钟结束前单击它。）</p>
<button onclick="myFunction()">试一试</button>
<button onclick="myStopFunction()">停止弹框</button>
<script>
var myVar;
function myFunction() {
  myVar = setTimeout(function(){ alert("Hello"); }, 3000);
}
function myStopFunction() {
  clearTimeout(myVar);
}
</script>
</body>
</html>

运行一下

定义与用法

clearTimeout() 方法清除使用 setTimeout() 方法设置的计时器。

setTimeout() 返回的 ID 值用作 clearTimeout() 方法的参数。

myVar = setTimeout("javascript function", milliseconds);

然后，如果函数尚未执行，则可以通过调用 clearTimeout() 方法停止执行。

浏览器支持

方法
clearTimeout()	1.0	4.0	1.0	1.0	4.0

语法

clearTimeout(id_of_settimeout)

参数值

参数	描述
id_of_settimeout	必填。setTimeout() 方法返回的计时器的 ID 值

技术细节

返回值:	无返回值

更多实例

实例

下面的示例有一个 "开始计数！" 的按钮启动计时器，启动后输入框将不断计数，还有一个 "停止计数！" 的按钮，可以停止计时器的计数:

<!DOCTYPE html>
<html>
<body>
<button onclick="startCount()">开始计数!</button>
<input type="text" id="txt">
<button onclick="stopCount()">停止计数!</button>
<p>
点击 "开始计数！" 按钮启动计时器。启动后输入框将从 0 开始不断计数。点击 "停止计数！" 的按钮停止计数。再点击 "开始计数！" 按钮再次启动计时器。
</p>
<script>
var c = 0;
var t;
var timer_is_on = 0;
function timedCount() {
  document.getElementById("txt").value = c;
  c = c + 1;
  t = setTimeout(timedCount, 1000);
}
function startCount() {
  if (!timer_is_on) {
    timer_is_on = 1;
    timedCount();
  }
}
function stopCount() {
  clearTimeout(t);
  timer_is_on = 0;
}
</script>
</body>
</html>