垃圾邮件异步回调打破了我的setTimeout延迟

问题描述 投票:5回答:1

因此,当玩家按下x时,我的角色div会更改其背景图像,如果角色触摸敌人,则杀死敌人。此图像开关用于做挥剑的模拟动画。

我使用设置超时来延迟将背景图像切换回其原始状态。这有效。

HOWEVER是一个错误,即如果我发送垃圾邮件x,则在图像切换之间不再存在延迟,并且我推测与播放器发送垃圾邮件x时从setTimeout函数堆叠异步回调有关的原因。

**使用此功能设置超时**

function pressOn(e) {
    e.preventDefault();
    let tempKey = (e.key == " ") ? "space" : e.key;
    keys[tempKey] = true;

         if (keys['x'] && player.swing == false){
              player.plane.style.backgroundImage ='url(guts2.png)';
                 setTimeout(function () {
                 player.swing = true;
                 }, 300);
          }

 }

**原始背景图像的**

function playGame() {
   if (player.inplay) {

       if (player.swing && !keys['x']){
             player.plane.style.backgroundImage ='url(guts1.png)';
             player.swing = false;
        }

    window.requestAnimationFrame(playGame);
    }
}

**链接至JS完整项目**

https://jsfiddle.net/mugs17/sud2ojxy/17/

javascript
1个回答
0
投票
-这是解决方案:

let player = { swing: false }

-
function pressOn(e) {
    e.preventDefault();
    let tempKey = (e.key == " ") ? "space" : e.key;
    keys[tempKey] = true;

    if (keys['x'] && player.swing == false) {

        player.plane.style.backgroundImage = 'url(guts2.png)';
        player.swing = true;

        setTimeout(function () {

            player.plane.style.backgroundImage = 'url(guts1.png)';
            player.swing = false;

        }, 1000);

}

© www.soinside.com 2019 - 2024. All rights reserved.