<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<input type="button" value="开始" id="btn1">
<input type="button" value="取消" id="btn2">
<script>
var btn1 = document.getElementById('btn1');
var btn2 = document.getElementById('btn2');
var timer; // 定时器的标识
// setTimeout 定时炸弹 隔一段时间，只执行一次
// setInterval 闹钟 隔一段时间，重复执行
// 点击开始按钮，执行setTimeout
btn1.onclick = function () {
// setTimeout 两个参数：要执行的函数，间隔时间（ms），返回值是一个整数，即定时器的标识
// 1. 第一个参数为匿名函数
// timer = setTimeout(function () {
// console.log('爆炸了');
// }, 3000);
// 2. 调用命名函数
// timer = setTimeout(fn(), 3000); 第一个参数不可以使用fn()，否则执行到这一行的时候，会调用fn函数得到其返回值，由于没有设置return，返回值为undefined，此时setTimeout的第一个参数就是undefined
timer = setTimeout(fn, 3000); // 只写函数名称fn
function fn() {
console.log('爆炸了');
}
};
// 点击取消按钮，阻止setTimeout的执行，取消定时器，获取setTimeout的返回值即定时器的标识
btn2.onclick = function () {
clearTimeout(timer);
};
</script>
</body>
</html>
4449
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
