为了账号安全,请及时绑定邮箱和手机立即绑定

我已经蹦了啊,要么不能实现同时运动到目标值,要么不能实现链式运动,已经试了将判断句放到各种位置,还是不能完美解决,哎!

我已经蹦了啊,要么不能实现同时运动到目标值,要么不能实现链式运动,已经试了将判断句放到各种位置,还是不能完美解决,哎!

正在回答

3 回答

将“var flag=true;”放入定时器内部,for in 循环的外部,解决定时器不能停止的问题。部分代码:

obj.timer=setInterval(function (){//定时器            
        var flag = true;//放在这里
            for(var attr in json)//for in 循环
            {
            //for in  内部
            }

具体解释就是:第一次进入定时器,flag被定义,赋值为true,接着进入for in循环,for in中会判断各个属性是否达成目的,只要有一项未达成,将flag置为false,此时flag=false;跳出 for in循环后,判断,flag是否为true,部分代码:

            if(flag)//判断
            {
                clearInterval(obj.timer);//清空定时器

因为flag=false,所以if(flag)不成立,不清空定时器;燃火

第二次进入定时器,定时器内第一行,flag被置为true,接着进入for in循环,for in中继续判断,若有一项未达成,flag又被置为false;跳出for in循环后,判断是否清楚定时器;。。。。第三次进入、第四次进入,如此反复,当for in中全部达成时,flag不会被置为false,此时flag=true;跳出 for in循环,判断if(flag)成立,清除定时器,over。

链式运动问题:不能进行链式运动的最大阻碍是回调函数的参数传递问题;

方案A

这是替换定时器中判断是否停止定时器那部分代码:

            if(flag)
            {
                clearInterval(obj.timer);
                if(fn)
                {
                    fn(obj);//将本次对象作为参数传入回调函数
                    //fn.call(obj);//对象替换
                }

添加方法时的代码:

window.onload=function(){
        var oLi = document.getElementById('li1');
        oLi.onmouseover=function(){
            startMove(oLi,{width:400,height:200,opacity:100},function(obj){//有参数
                startMove(obj,{width:200,height:100,opacity:30},function(obj){//有参数
                    //startMove(obj,{width:400,height:200,opacity:100});//传递参数
                });
            });
        }
}

方案B

定时器中:

if(flag)
            {
                clearInterval(obj.timer);
                if(fn)
                {
                    //fn(obj);//将本次对象作为参数传入回调函数
                    fn.call(obj);//对象替换
                }

添加方法时的代码:

window.onload=function(){
        var oLi = document.getElementById('li1');
        oLi.onmouseover=function(){
            startMove(oLi,{width:400,height:200,opacity:100},function(){//无参数
                startMove(this,{width:200,height:100,opacity:30},function(){//无参数
                    //startMove(this,{width:400,height:200,opacity:100});//传递this
                });
            });
        }
}

其余代码,参考老师写的,这里是将对应的部位进行替换。如果运行有问题,稍微调试下,看看变量名、参数顺序是否对应。我自己测试,没有问题。

最后:下面这段代码紧跟flag=false;后面较为合理

if(attr=='opacity')
{
    obj.style.filter='alpha(opacity:'+(iCur+iSpeed)+')';
    obj.style.opacity=(iCur+iSpeed)/100;
}
else
{
    obj.style[attr]=iCur+iSpeed+'px';
}


3 回复 有任何疑惑可以回复我~
#1

marshall_stan 提问者

非常感谢!
2015-11-12 回复 有任何疑惑可以回复我~
#2

木木380

方案A中不加参数,只需要将flag=true放入计时器中好像就可以了
2016-09-04 回复 有任何疑惑可以回复我~

不好意思写错了。只需要将定义的flag=true;放入计时器中即可以完美解决问题。记住重新在浏览器中打开。

3 回复 有任何疑惑可以回复我~
#1

东风破

大神,能给讲一下为啥flag放入计时器中就解决了,非常感谢
2015-09-10 回复 有任何疑惑可以回复我~
#2

一布工程师

牛人,研究很久 终于解决该问题了
2015-09-14 回复 有任何疑惑可以回复我~

只需要将定义的flag=true;放入for循环即可以完美解决问题。记住重新在浏览器中打开。

1 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

我已经蹦了啊,要么不能实现同时运动到目标值,要么不能实现链式运动,已经试了将判断句放到各种位置,还是不能完美解决,哎!

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信