js中setTimeout和clearTimeout的使用

全栈程序员站长

发布于 2022-11-17 15:57:01

3.4K0

文章被收录于专栏：全栈程序员必看全栈程序员必看

大家好，又见面了，我是你们的朋友全栈君。

一、概念

1、js中可以通过setTimeout函数设置定时器，让指定的代码在指定的时间运动. 如果我们希望在setTimeout之行前终止其运行就可以使用clearTimeout()。

2、clearTimeout()用于重置js定时器，如果你希望阻止setTimeout的运行，就可以使用clearTimeout方法。

二、使用场景

1、写计时器

2、需要让程序隔一段时间处理什么事情，如3秒后自动关闭弹出框等

3、事件延迟，满足业务需求，如鼠标从主菜单moveout的时候，判断鼠标是否moveover副菜单，再隐藏副菜单。

三、使用方法

[html] view plain copy

<html>  
<head>  
<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>  
<form>  
<input type=“button” value=“开始计时！” onClick=“timedCount()”>  
<input type=“text” id=“txt”>  
<input type=“button” value=“停止计时！” onClick=“stopCount()”>  
</form>  
  
<p>  
请点击上面的“开始计时”按钮。输入框会从 0 开始一直进行计时。点击“停止计时”可停止计时。  
</p>  
  
</body>  
  
</html>

发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/213558.html原文链接：https://javaforall.cn

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2022年10月26日，如有侵权请联系 cloudcommunity@tencent.com 删除

html