js中如何停止或清除timeout定时任务操作的方法

107 阅读 0 评论 71 点赞

我是靠谱客的博主要减肥乌冬面，这篇文章主要介绍js中如何停止或清除timeout定时任务操作的方法，现在分享给大家，希望可以做个参考。

js中如何停止或清除timeout定时任务操作的方法

- 设置定时任务
- 取消定时任务
- clearTimeout(实例名)说明

设置定时任务

复制代码

1
2
<button id="button" class="btn btn-success">保存</button>

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 //按钮置灰，等待状态
    var time = 25;
    var timer;
    function edit_room() {
        if (time == 0) {//重新获取验证码
            $("#button").attr("disabled", false);
            $("#button").text('保存');
            time = 25;
            return false;//清除定时器
        } else {
            $("#button").attr("disabled", true);
            $("#button").text("正在更新直播间(" + time + ")");
            time--;
        }
        //设置一个定时器
        timer = setTimeout(function () {
            edit_room()
        }, 2500)
    }

取消定时任务

复制代码

1
2
3
4
5
6
7
8
    //按钮恢复 清除定时器
    function clearTimer() {
        clearTimeout(timer);
        $("#button").attr("disabled", false);
        $("#button").text('保存');
        time = 25;
    }

clearTimeout(实例名)说明

想要停止或清除timeout事件，请用clearTimeout。为使用该方法，我们需要在 setTimeout 方法中指定的实例名。

如下为步骤

a)当调用setTimeout方法时同时获取产生的实例名。
示例: var ctime = setTimeout(“xxxxx”,30000);
b)使用该实例名来中止 timeout 执行。示例: clearTimeout(ctime);
示例:如下示例将每3秒(3000 毫秒)给变量加 1，然后弹出提示框输出值。 clearTimeout 将在您点击停止按钮时触发，并取消每 3 秒一次的执行。

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script language=javascript>
var x = 0; 
var timer; 
function testtimeout(){
	x = x+1;
	alert(" x 的值是 - "+x);
	timer = setTimeout("testtimeout()",3000);
}
function stoper() {
	clearTimeout(timer);
}
</script>
<form name=xcv>
<input type=button onClick="testtimeout()" value=启动>
<input type=button onClick="stoper()" value=停止>
</form>