为什么timer必须声明在函数外面(附代码)?

来源:2-1 JS速度动画

王不留形

2016-01-03 17:56

timer直接在函数里声明使用的话会有bug,放在外面就没事了,求解

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>缓冲运动</title>

<style type="text/css">

*{border:0; margin:0;}

#div1{ width:200px; height:200px; background:red; position:relative; top:0; left:-200px;}

.div2{ width:20px; height:40px; background:blue; position:absolute; top:80px; left:200px;}

</style>

<script type="text/javascript">

window.onload=function(){

var div1=document.getElementById("div1");

div1.onmouseover=function(){

startMove(0);

}

div1.onmouseout=function(){

startMove(-200);

}

var timer=null;

function startMove(target){

clearInterval(timer);

timer=setInterval(function(){

var speed=(target-div1.offsetLeft)/20;

speed=speed>0?Math.ceil(speed):Math.floor(speed);

if(target==div1.offsetLeft){

clearInterval(timer);

}else{

div1.style.left=div1.offsetLeft+speed+"px";

}

},30);

}

}

</script>

</head>


<body>

<div id="div1"><div class="div2"></div></div>


</body>

</html>


写回答 关注

2回答

  • 慕神6131772
    2016-01-04 14:03:15
    已采纳

    函数体中的局部变量只在函数执行时生成的调用对象中存在,函数执行完毕时局部变量即刻销毁。就是说你的函数执行到开启定时器以后,就算执行结束了,那么这个局部变量就会被销毁。也就是说刚打开定时器,定时器就没了

    王不留形

    非常感谢!

    2016-01-04 15:13:37

    共 1 条回复 >

  • 蛋疼少年的和谐青春
    2016-01-03 19:40:30

    声明在外边  是作为一个全局变量,那样你在任何function里面都可以调用,如果你是声明在function里面就成了局部变量,只能在声明的function里面来使用,其他function调用不到这个变量,所以会报错。

    王不留形

    可是我这个timer只用在了startMove()一个函数里啊?我声明在这个函数里还是会有bug

    2016-01-03 21:03:20

    共 1 条回复 >

JS动画效果

通过本课程JS动画的学习,从简单动画开始,逐步深入各种动画框架封装

113925 学习 · 1443 问题

查看课程

相似问题