                        課程
                    
                        /前端開發(fā)
                        
                            /JavaScript
                        
                        /JS動(dòng)畫效果

flag的問題?。。∏蟠笊窠忉?/h1>
我就納悶了。按代碼所示。flag放在定時(shí)器外面，最開始是true，執(zhí)行第一次動(dòng)畫時(shí)，不是所有動(dòng)畫都到達(dá)，于是定時(shí)器的flag被設(shè)置為false，然后該干嘛就干嘛，接下來執(zhí)行30毫秒后的第二次動(dòng)畫，于是乎，問題來了，作為startmove內(nèi)的變量，定時(shí)器外的變量flag，已經(jīng)被上一次的動(dòng)畫設(shè)置為了false，所以，接下來的判斷語句flag永遠(yuǎn)是false， ?等同于if（flag）這個(gè)是不可能實(shí)現(xiàn)的！！定時(shí)器內(nèi)部也沒有設(shè)置flag為true的語句，動(dòng)畫講永遠(yuǎn)不停止！！真正的問題來了：屏幕中老師這樣敲的代碼，瀏覽器中居然能實(shí)現(xiàn)動(dòng)畫?。?！求大神解釋！！

葛烏

2016-04-21

源自：JS動(dòng)畫效果 6-2

關(guān)注問題我要回答

1699

操作

收起

7 回答

風(fēng)_起回答被采納 +3 積分
2016-04-21

你再看一看。

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

#1

葛烏提問者

我自己的理解是，flag要放在定時(shí)器里面，每執(zhí)行一次，都會(huì)重置flag=true。這樣才能運(yùn)行。。放在外面，雖然老師的動(dòng)畫看起來能夠執(zhí)行。但是定時(shí)器永遠(yuǎn)是開著的，只是speed到后期為0，看起來就想是動(dòng)畫停止了一樣··反復(fù)想應(yīng)該是這樣解釋

2016-04-21 回復(fù) 有任何疑惑可以回復(fù)我~

#2

風(fēng)_起回復(fù) 葛烏提問者

一個(gè)定時(shí)器改變多個(gè)屬性，你可以看下我在你這條上面的方法（多個(gè)定時(shí)器改變對(duì)應(yīng)的屬性）。所以flag=true應(yīng)該放在這唯一一個(gè)定時(shí)器中初始。還有，清除定時(shí)器，if(flag)你放在哪里？

2016-04-21 回復(fù) 有任何疑惑可以回復(fù)我~

#3

哈嘍姑娘回復(fù) 葛烏提問者

你是對(duì)的，若用老師的方法，定時(shí)器都沒關(guān)過，只是后面達(dá)到目標(biāo)值后，speed等于0了，這樣是無法再用回調(diào)函數(shù)完成鏈?zhǔn)竭\(yùn)動(dòng)的。要將flag放在定時(shí)器里面。

2016-04-29 回復(fù) 有任何疑惑可以回復(fù)我~

查看1條回復(fù)

qq_過去_3
2016-05-10

NeoWu222同學(xué)的方法，我試了，發(fā)現(xiàn)好像flag一直是處于為1，并沒有加到3，也就是定時(shí)器還一直是開著的

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

#1

qq_過去_3

是我自己看錯(cuò)。。。

2016-05-10 回復(fù) 有任何疑惑可以回復(fù)我~

qq_過去_3
2016-05-09

我覺得不要加flag也可以吧，定時(shí)器一直開著應(yīng)該沒關(guān)系吧，所有的運(yùn)動(dòng)也能同時(shí)實(shí)現(xiàn)（個(gè)人想法，不知道行不行）

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

Wenfei_Jor
2016-04-26

這個(gè)問題和回答給力！給你們點(diǎn)個(gè)贊！

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

NeoWu95
2016-04-23

不好意思json沒有獲取長度的屬性或方法，所以要自己定義一個(gè)方法來獲取

把最后一個(gè)if(flag == json.length)改為if(flag == getLength(json))

方法定義代碼：

function getLength(json){

? ? var length = 0;

? ? for(var attr in json){

? ? ? ? length++;

? ? }

? ? return length;

}

1 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

#1

葛烏提問者

GET，感覺你這種計(jì)算flag的思路比視頻里的更令人清晰！

2016-04-23 回復(fù) 有任何疑惑可以回復(fù)我~

#2

lzlbu2

太感謝了，看了這么多的回答，只有你的這個(gè)方法最好用，還解決了老師的bug

2016-05-14 回復(fù) 有任何疑惑可以回復(fù)我~

NeoWu95
2016-04-23

把flag初始為0；當(dāng)有一個(gè)屬性達(dá)到目標(biāo)值時(shí)，flag自增1；當(dāng)flag 等于 json的長度時(shí)再清楚定時(shí)器；

代碼如下：

function startMove(obj,json,fn){

? ? clearInterval(obj.timer);

? ? obj.timer = setInterval(function(){

? ? ? ? var flag = 0;

? ? ? ? for(var attr in json){

? ? ? ? ? ? //1.取當(dāng)前值

? ? ? ? ? ? var icur = 0;

? ? ? ? ? ? if(attr == 'opacity'){

? ? ? ? ? ? ? ? icur = Math.round(parseFloat(getStyle(obj,attr))*100);

? ? ? ? ? ? //是不是不需要parseFloat

? ? ? ? ? ? }else{

? ? ? ? ? ? ? ? icur = parseInt(getStyle(obj,attr));

? ? ? ? ? ? }

? ? ? ? ? ? //2.算速度

? ? ? ? ? ? var speed = (json[attr] - icur)/8;

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

? ? ? ? ? ? //3.檢測停止

? ? ? ? ? ? if(icur == json[attr]){

? ? ? ? ? ? ? ? flag++;

? ? ? ? ? ? }

? ? ? ? ? ? if(attr == 'opacity'){

? ? ? ? ? ? ? ? obj.style.filter = 'alpha(opacity:' + (icur + speed) + ')';//針對(duì)IE

? ? ? ? ? ? ? ? obj.style.opacity = ?(icur + speed)/100;

? ? ? ? ? ? ? ? //針對(duì)chrome、FF

? ? ? ? ? ? }else{

? ? ? ? ? ? ? ? obj.style[attr] = icur + speed + 'px';?

? ? ? ? ? ? }

? ? ? ? ? ??

? ? ? ? ? ? if(flag == json.length){

? ? ? ? ? ? ? ? ? ? clearInterval(obj.timer);

? ? ? ? ? ? ? ? ? ? if(fn){

? ? ? ? ? ? ? ? ? ? ? ? fn();

? ? ? ? ? ? ? ? ? ? }

? ? ? ? ? ? ? ? }

? ? ? ? ? ? };?

? ? },20)

? ??

}

1 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

#1

qq_過去_3

這樣可以嗎？我試了，flag好像一直都是為1，就往加到3的時(shí)候？

2016-05-09 回復(fù) 有任何疑惑可以回復(fù)我~

#2

protry

flag需要做全局變量吧

2016-05-17 回復(fù) 有任何疑惑可以回復(fù)我~

#3

jinleli 回復(fù) protry

寫在定時(shí)器里面是一樣的雖然每次flag都會(huì)初始為0，但是只要本次定時(shí)執(zhí)行時(shí)for循環(huán)每個(gè)屬性都等于目標(biāo)值，flag就會(huì)變?yōu)?定時(shí)就取消了

2016-05-29 回復(fù) 有任何疑惑可以回復(fù)我~

查看1條回復(fù)

風(fēng)_起
2016-04-21

你試一下不就知道老師寫的代碼是對(duì)是錯(cuò)了。加個(gè)fn，做鏈?zhǔn)竭\(yùn)動(dòng)?？存?zhǔn)竭\(yùn)動(dòng)有木有？我個(gè)人估計(jì)應(yīng)該是沒有。flag設(shè)置成false之后，就再也沒有變回true了。。。老師代碼是有bug

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答