jquery - 听众甚至在画布上也使用键？

Question

我有一个我在画布上制作的游戏，它监听 w、a、d 和箭头键。但是，当我离开画布并单击画布下方的“单击此处订阅”按钮并尝试输入 w、a 或 d 时，他们不会输入。

我对按钮使用 JQuery，对游戏使用 HTML5 Canvas。

是什么导致了这种情况以及如何阻止它？有没有办法可以在单击按钮时停止侦听器并在关闭 JQuery 屏幕时重新启动它？

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

Answer 1

听起来您正在侦听整个窗口上的关键事件。

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

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

然后，当用户将焦点更改为您的订阅表单时，画布键处理程序将不再接收键事件。

    // 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();