Может показаться, что setTimeout не работает?

Question

var ExplodeFrame = 0; 
var ExplodeTimeout; 

Вся эта часть проверяет, когда игрок бьет лаву. Оно работает. см. прокомментированную часть для звонка в анимацию

if((Player.x > Lavas[i].x && Player.x < (Lavas[i].x + Lavas[i].width)) || (Player.x + Player.width > Lavas[i].x && Player.x + Player.width < (Lavas[i].x + Lavas[i].width))) 
    { 
    if((Player.y > Lavas[i].y && Player.y < Lavas[i].y + Lavas[i].height) || (Player.y + Player.height > Lavas[i].y && Player.y + Player.height < Lavas[i].y + Lavas[i].height)) 
    { 
    ExplodeTimeout = setTimeout(DrawSpawnAnimation, 200); //this part is new and might not work 
    Player.jumping = false; 
    Player.velY = 0; 
    Player.velX = 0; 
    Player.x = Player.spawnX; 

    Player.y = Player.spawnY; 
    Player.playerColour = Player.colour; 

    } 
    } 


} 

Этот метод, похоже, не работает для меня?

function DrawSpawnAnimation() 
{ 

ExplodeFrame++; 
alert("current frame" + ExplodeFrame); 
var explodeX = Player.x - 50; 
var explodeY = Player.y - 50; 

if(ExplodeFrame == 1) 
{ 
ctxAnimation.drawImage(spriteSheet,0,2740,100,100,explodeX,explodeY,100,100); 
} 
else if(ExplodeFrame == 2) 
{ 
ctxAnimation.drawImage(spriteSheet,100,2740,100,100,explodeX,explodeY,100,100); 
} 
else if(ExplodeFrame == 3) 
{ 
ctxAnimation.drawImage(spriteSheet,200,2740,100,100,explodeX,explodeY,100,100); 
} 
else if(ExplodeFrame == 4) 
{ 
ctxAnimation.drawImage(spriteSheet,300,2740,100,100,explodeX,explodeY,100,100); 
} 
else if(ExplodeFrame == 5) 
{ 
ctxAnimation.drawImage(spriteSheet,400,2740,100,100,explodeX,explodeY,100,100); 
} 
else 
{ 
ExplodeFrame = 0; 
clearTimeout(ExplodeTimeout); 
    ctxAnimation.clearRect(0,0,canvasWidth,canvasHeight); 
} 

}

Он должен показать анимацию на 5 кадров в секунду, пока его снова. Это то, что я пытаюсь сделать.

Answer 1

setTimeout запускает ваш код один раз. Кажется, что вы ищете что-то, что работает каждые 200 миллисекунд. Для этого используйте setInterval. Он работает так, как вы пытаетесь использовать setTimeout. При использовании setInterval, вы очистите его с помощью вызова clearInterval

Answer 2

setTimeout только запускает функцию только один раз:

http://www.w3schools.com/jsref/met_win_settimeout.asp

Это похоже на то, что вы ищете является setInterval:

http://www.w3schools.com/jsref/met_win_setinterval.asp

Answer 3

Во-первых, замените операторы if на

ctxAnimation.drawImage(spriteSheet,(ExplodeFrame - 1) * 100,2740,100,100,explodeX,explodeY,100,100); 

Во-вторых, вы вызываете метод DrawSpawnAnimation один раз. Чтобы увидеть анимацию, вы должны называть ее многократно. Сделайте это, добавив установку другого тайм-аута в конце DrawSpawnAnimation:

function DrawSpawnAnimation() 
{ 
    ... 
    if (ExplodeFrame < 5) 
    { 
     setTimeout(DrawSpawnAnimation, 20); 
    } 
}