setTimeout的一点小疑点

setTimeout的一点小问题
var c=0
var t
function timedCount()
{
document.getElementById('txt').value=c
c=c+1
t=setTimeout("timedCount()",1000)
}
<input type="button" value="开始计时！" onClick="timedCount()">

如上的代码，如果你点了两次计时按钮的话，就变成，相当于两个计时器了，c增大的速度就变快了。

但是，不是操作的同一个变量么？
为什么计时器会是这样？？？
[解决办法]
js中，除了基本数据类型的赋值，其它类型赋值都是地址传递，也就是你第一次调用setTimeout(),将该地址赋值给t，第二次再调用时，又产生一个计数器，这时这个计数器的地址覆盖了t，其实是有两个setTimeout在运行，你可以在页面上再加一个按钮用来清除<input id="txt" type="button" value="clear" onClick="clear()"></body>

function clear(){
cleatTimeout(t);
}

这样你点击两次“开始计时”，在点击一次“clear”，页面上的计数器仍在运行，试试吧
[解决办法]
启动了多个计时器了，启动新计时器时要先中断上一个计时器，这种逻辑用Timeout不好，还是用Interval吧。

var c=0,timer;

function timedCount()
{
clearInterval(timer);//终止上一个计时器
timer=setInterval("timedCount1()",1000)
};

function timedCount1(){
document.getElementById('txt').value=c;
c=c+1;
}

[解决办法]
为什么会出现这种问题呢,我来解释一下.

var c=0//全局变量
var t
function timedCount()
{
document.getElementById('txt').value=c
c=c+1
t=setTimeout("timedCount()",1000)
}

1.你的c是全局变量,不管执行多少次timedCount,修改的都是同一个c.
2.你的setTimeout("timedCount()",1000),是一自我直循环调用timedCount,永不停止,每次执行都产生一个新的timedCount事件插入javascript的执行线程的执行队列,此时队列里只有一个setTimeout的事件,只是每次这个执行完都再产生一个新的插入队列.
3.如果你点击n次按钮,那么timedCount()执行n次,也就产生了n个setTimeout事件,也就是javascript的执行队列里面有了n个setTimeout事件
4.同时存在n个执行事件修改c,那么c的增加速度自然是n倍的速度了
[解决办法]
setTimeout() 方法的返回值是一个唯一的整数数值，
这个数值有什么用呢？如果你想要终止 setTimeout() 方法的执行，那就必须使用 clearTimeout() 方法来终止，而使用这个方法的时候，系统必须知道你到底要终止的是哪一个 setTimeout() 方法 (因为你可能同时调用了好几个 setTimeout() 方法)，这样 clearTimeout() 方法就需要一个参数，这个参数就是 setTimeout() 方法的返回值 (数值)，用这个数值来唯一确定结束哪一个 setTimeout() 方法。

查看更多 下一篇