js中setTimeout和clearTimeout的使用

最新推荐文章于 2024-05-29 15:14:06 发布

SundayHugo

最新推荐文章于 2024-05-29 15:14:06 发布

阅读量1.1w

点赞数 1

CC 4.0 BY-SA版权

分类专栏：前端学习

本文链接：https://blog.youkuaiyun.com/weeknuaa/article/details/9003981

前端学习专栏收录该内容

9 篇文章

订阅专栏

一、概念

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

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

二、使用场景

1、写计时器

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

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

三、使用方法

<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>