JS中多个setTimeOut函数为什么会同时运行?
<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)
}
</script>
</head>
<body>
<form>
<input type="button" value="开始计时!" onClick="timedCount()">
<input type="text" id="txt">
</form>
<p>请点击上面的按钮。输入框会从 0 开始一直进行计时。</p>
</body>
</html>
我是前端新手。写了一段计时器的代码。代码如上,为什么多次点击按钮后,计时器速度会加倍,多个setTimeOut函数同时运行?JS不是单线程的吗?
航海♂日志
9 years ago
Answers
你每点一次,就执行一次timedCount,产生一个新的定时器
你之前设置的定时没有清理掉,导致你的定时器随着你的点击次数的增加而增加
代码修改为:
<script type="text/javascript">
var t;
function timedCount(continueFlag)
{
var countEle=document.getElementById('txt');
var current=parseInt(countEle.value)||0;
continueFlag = continueFlag||false;
if(!continueFlag){
t&&clearTimeout(t);
countEle.value=0;
}else{
countEle.value= current+1;
}
t=setTimeout(function(){
timedCount(true);
},1000);
}
</script>
一代阿迪王
answered 9 years ago