var pos=1;//为啥写到局部变量方块就不能正常回来呢?
来源:6-1 JS和CSS3结合实现动画
慕粉0915
2021-07-17 23:43:11
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>认识对象</title>
<style>
#box{
position: absolute;
left: 200px;
width: 300px;
height: 300px;
background: #000;
}
</style>
</head>
<body>
<button id="btn">开始跑</button>
<div id="box"></div>
<script>
var btn=document.getElementById('btn');
var box=document.getElementById('box');
btn.onclick=function(){
box.style.transition='1s linear all 0s';
var pos=1;//为啥写到局部变量方块就不能正常回来呢?
if(pos==1){
box.style.left='1000px';
a=2;
}
else if(pos==2) {
box.style.left='100px';
a=1;
}
}
</script>
</body>
</html>
为啥一定要var pos=1写在最外面,作为全局变量呢?
1回答
好帮手慕慕子
2021-07-18
同学你好,因为var pos = 1作为局部变量后,每次点击按钮时 ,都会重新声明pos并赋值为1,这样,就只会执行满足pos等于1的if语句了,导致方块第一次运行到1000px处,就一直在1000px的位置无法回去。所以需要将var post = 1 放在点击事件函数外面。
另外,if语句中应该是这对pos进行重新赋值,而不是给a赋值,建议修改:
祝学习愉快~
相似问题