Question

EventListener keydown正在运行但是keyup（貌似）无效。这是我的剧本：

var Keys = [];

var FrameLoop = window.requestAnimationFrame || 
window.webkitrequestAnimationFrame || window.mozrequestAnimationFrame || 
window.msrequestAnimationFrame;
window.requestAnimationFrame = FrameLoop;

window.onload = GameChange();

function GameChange() {
    if (Keys[39] == true) {
        alert("right");
    }
    FrameLoop(GameChange);
}

document.body.addEventListener("keydown", function(k) {
    Keys[k.keyCode] = true;
});

document.body.addEventListener("keyup", function(k) {
    Keys[k.keyCode] = false;
});

正如人们所看到的，代码的目的是提醒＆＃34;对＆＃34;单击右箭头并继续执行此操作直到右箭头键被释放。

Answer 1

这是因为alert()是脚本阻止。

这意味着，在此调用中，当您调用时正在运行的脚本暂停，直到用户关闭警报（所有其他提示窗口都相同）。

除此之外，requestAnimationFrame调度在事件回调循环之前执行，并且你有一个alert()的无限循环，除非你能够在下一个屏幕刷新之前关闭它_{（祝你好运用那个）}。

简单的解决方案是不使用alert() （永远？）。相反，如果要在代码中调试某些内容，请使用console.log，这不会停止正常执行脚本。

您的固定代码段。

var Keys = [];

var FrameLoop = window.requestAnimationFrame || 
window.webkitrequestAnimationFrame || window.mozrequestAnimationFrame || 
window.msrequestAnimationFrame;
window.requestAnimationFrame = FrameLoop;

window.onload = GameChange();

function GameChange() {
    if (Keys[39] == true) {
        console.log("right");
    }
    FrameLoop(GameChange);
}

document.body.addEventListener("keydown", function(k) {
    Keys[k.keyCode] = true;
});

document.body.addEventListener("keyup", function(k) {
    Keys[k.keyCode] = false;
    console.log('keyup');
});
onfocus = function(){document.body.className="focus"};
onblur = function(){document.body.className=""};

.focus > p {opacity: 0}

<p>click here to gain focus</p>

EventListener keydown正在运行，但keyup不是

1 个答案: