在JavaScript中,为什么我们在用定时器控制某一元素移动时,有时会出现元素越走越快的现象

当我们在用定时器时(setinterval),如果我们不清定时器,它会不停的运转下去。有人会问,我只命名了一个定时器的名字,在重新调用这个定时器名字时,这个定时器应该重新开始啊,其实不是这样的。当我们在启动一个定时器时,电脑会为我们开启一个定时器,当我们再次用同一个名字开启定时器时,电脑会再开另外开启一个定时器,与先前开启的定时器无关,我们所谓的定时器的名字,它只是一个变量而已,并不是定时器的名字,它的功能是清定时器用的,也就是通过clearInterval(变量)使定时器停止运行。代码实例如下:

下面是一个用键盘控制元素head走的一个函数

var timer;

function keyContMove(flag){

//在调用定制器时,首先要清定时器,如果没有这条语句的话,每次按键时都会调用此函数从而另开一个定时器,这样就会使head元素越走越快
clearInterval(timer);
timer=setInterval(function(){
if (flag) {

//speedY是y轴方向的速度,speedX是x轴方向上的速度
top+=speedY;
head.style.top=top+'px';
}else {
left+=speedX;
head.style.left=left+'px';
}

},16)
}

切记程序里的timer是定时器的返回值,不是定时器的名字!!!

posted on 2016-04-25 21:16  Paul.SJ  阅读(960)  评论(0编辑  收藏  举报

导航