这篇文章主要介绍了javascript中停止执行setinterval和settimeout事件的方法,本文给出操作实例代码和语法介绍,需要的朋友可以参考下
js 代码中执行循环事件时,经常会用到 setinterval 和 settimeout 这两个方法,关于这两个方法的细节这里不详细讨论了,简要分享下在需要停止循环事件的时候该如何操作。
(1)setinterval 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式,停止该方法可使用 clearinterval 方法。具体示例如下:
复制代码 代码如下:
<html>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<body>
<input type="text" id="clock" size="50" />
<script language=javascript>
var int=self.setinterval("clock()",50);//每隔 50 毫秒调用 clock() 函数
function clock(){
var t=new date();
document.getelementbyid("clock").value=t;
}
</script>
<button onclick="window.clearinterval(int)">停止 interval</button>
</body>
</html>
语法 clearinterval(id_of_setinterval)
参数 id_of_setinterval 表示由 setinterval() 返回的 id 值。
clearinterval() 方法可取消由 setinterval() 设置的 timeout;clearinterval() 方法的参数必须是由 setinterval() 返回的 id 值。
(2)settimeout 方法用于在指定的毫秒数后调用函数或计算表达式。停止该方法可使用 cleartimeout 方法。具体示例如下:
提示:settimeout() 只执行 code 一次。如果要多次调用,请使用 setinterval() 或者让 code 自身再次调用 settimeout()。
复制代码 代码如下:
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript">
var c=0;
var t;
function timedcount(){
document.getelementbyid('txt').value=c;
c=c+1;
t=settimeout("timedcount()",1000);
}
function stopcount(){
cleartimeout(t);
}
</script>
</head>
<body>
<input type="button" value="开始计数" onclick="timedcount()">
<input type="text" id="txt">
<input type="button" value="停止计数" onclick="stopcount()">
</body>
</html>
cleartimeout() 方法可取消由 settimeout() 方法设置的 timeout。
语法 cleartimeout(id_of_settimeout)
参数 id_of_setinterval 表示由 settimeout() 返回的 id 值。该值标识要取消的延迟执行代码块。
更多javascript中停止执行setinterval和settimeout事件的方法。