侦听器即使在画布外也要使用密钥？

Question

我有一个用canvas制作的游戏，可以监听w，a，d和箭头键。然而，当我离开画布，点击画布下面的“点击这里订阅”按钮，并尝试输入w，a或d，他们就不会输入了。

我使用按钮的JQuery和游戏的HTML5画布。

这是WHat造成的，你知道如何阻止它吗？有没有办法在单击按钮时停止监听程序，并在JQuery屏幕关闭时重新启动监听程序？

这就是：http://www.slimedrop.com

Answer 1

听起来像是在监听整个窗口上的关键事件。

您可以通过设置画布的选项卡索引来允许画布本身接收关键事件。

然后在画布上监听关键事件，而不是在窗口上。

然后，当用户将焦点切换到您的订阅窗体时，canvases键处理程序将不再接收键事件。

    // get a reference to the canvas
    var canvas=document.getElementById('canvas');

    // set canvas to be a tab stop (necessary to get keydown events)
    canvas.setAttribute('tabindex','0');

    // have handleKeydown handle keydown events on the canvas
    canvas.addEventListener('keydown',handleKeydown,false);

    // set focus to the canvas so keystrokes are immediately handled
    canvas.focus();