this问题，老师在startMove中用了this，我想换一种方法，所以把this改为了aLi[i] 然后就不能用了，大神们教教我该把this改成什么？
守望6
2016-10-20 14:53
<!DOCTYPE html>/*this问题，老师在startMove中用了this，我想换一种方法，所以把this改为了aLi[i] 然后就不能用了，大神们教教我该把this改成什么？*/
<html>
<head lang="en">
<meta charset="UTF-8">
<title>多物体运动</title>
<style>
body, ul,li{
padding: 0;
margin: 0;
}
ul,li
{
list-style:none;
}
ul li
{
width: 200px;
height: 100px;
background: yellow;
margin-bottom: 20px;
}
</style>
<script>
window.onload=function()
{
var aLi=document.getElementsByTagName('li');
for(var i=0;i<aLi.length;i++)
{
aLi[i].timer=null;/*从来都没有定义过变量timer，居然能用，这里是不是顺便定义了？*/
aLi[i].onmouseover=function()
{
startMove(this,400);
} /* this到底指的是哪里？*/
aLi[i].onmouseout=function()
{
startMove(this,200);
}
}
}
/*var timer=null;*/
function startMove(obj,iTarget)
{
clearInterval(obj.timer);
obj.timer=setInterval(function(){
var speed=(iTarget - obj.offsetWidth)/8;/*实现缓冲运动*/
speed=speed>0?Math.ceil(speed):Math.floor(speed);
if(obj.offsetWidth==iTarget)
{
clearInterval(obj.timer);
}
else{
obj.style.width=obj.offsetWidth+speed+'px';
}
},30)
}
</script>
</head>
<body>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</body>
</html>
3回答
-
- 慕粉198531
- 2016-10-27 15:31:38
简单说for循环中的变量i只在其内部有效;当其他函数调用时i的值只能取到循环后的最后一个值，而this是指的调用的函数，具体可以百度多搜搜this的用法；个人见解！
-
- 守望6
- 2016-10-20 15:55:52
我提问中的代码是老师的代码，老师的代码用了this，是正确的。现在我把代码中的for循环改成了这样，然后鼠标移上去，和离开就没反应了，还是不对，我可能理解错你的意思了。。。大神方便再修改一下吗？感激不尽
for(var i=0;i<aLi.length;i++)
{
aLi[i].index=i;
i.timer=null;
{
startMove(i,400);
}
i.onmouseout=function()
{
startMove(i,200);
} -
- 稻穗陈落入梦来
- 2016-10-20 15:29:52
this 指触发的这个JS事件的载体；如果一定要用for 循坏绑定事件的话，要在for循环中定义一个索引值，在后面绑定事件中用到这个索引：for（）{a[i].index=i}
JS动画效果
113923 学习 · 1443 问题
相似问题