Keypress和鼠标事件

Question

我正在使用Three.js构建演示（即使我希望输入在任何库中以相同的方式工作）

我尝试研究用户输入/事件的主题，并且有许多答案可以使用Jquery或其他一些库或附加到web元素。

我刚刚学习，所以我想坚持使用Vanilla JS。

我正在寻找一种方法，如果按下键盘按钮示例，如果＆＃39; W＆＃39;然后按下console.log（＆＃34;键：＆＃39; W＆＃39;被按下＆＃34;）;

鼠标输入/事件鼠标位置相同： console.log（mouseX +＆＃34;，＆＃34; + mouseY）;

问题是找到了香草JS的裸骨样本。只是寻找一个简单的解决方案，我可以稍后建立，例如：

1. 如果按下按键或鼠标按钮，则返回true
2. 获取鼠标x和y的位置
3. 稍后添加事件que以与framerate / loop进行同步

我读到事件/输入可能具有挑战性，只是寻找正确方向的推动。

P.S。我不介意使用轻量级库来简化这一过程，可能支持触摸屏/移动甚至控制器输入。

主要用于游戏目的。

Answer 1

我喜欢使用我自己修改的THREEx.KeyboardState版本进行键盘输入。它并不太复杂 - 它只是订阅文档对象上的 keyup 和 keydown 事件，并缓冲每帧的所有事件。我的游戏每帧调用update方法来循环缓冲区。

document.addEventListener("keydown", this._onKeyDown, false);
document.addEventListener("keyup", this._onKeyUp, false);

我为鼠标和Chrome中的游戏手柄写了类似的内容。它们都相当简洁明了。希望这应该给你一些很好的例子。

使用Javascript或Typescript在Github上

The source can be viewed。