按键和鼠标事件

Keypress and mouse events

我正在使用 Three.js 构建一个演示（尽管我希望输入在任何库上都以相同的方式工作）

我尝试研究用户 input/events 的主题，并且有很多答案使用 jQuery 或其他一些库或附加到网络元素。

我只是在学习，所以我想坚持使用 Vanilla JS。

我只是在寻找一种方法，如果按下键盘按钮，例如如果按下 W 然后 console.log("Key: 'W' was pressed");.

鼠标相同 input/event 鼠标位置：

console.log(mouseX + ", " + mouseY);

问题是找到普通 JS 的基本样本。只是在寻找一个简单的解决方案，我可以在以后建立，例如：

  1. return 如果按下键或鼠标按钮则为真
  2. 获取鼠标 x 和 y 的位置
  3. 稍后添加事件队列以与 framerate/loop
    4. 同步

我读到 events/input 可能具有挑战性，只是在寻找正确方向的推动力。

P.S。我不介意使用轻量级库来简化此操作，可能支持触摸 screens/mobile 甚至控制器输入。

主要用于游戏目的。

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

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

我在 Chrome 中为鼠标和游戏手柄编写了类似的代码。它们都相当干净和直接。希望这会为您提供一些很好的工作示例。

The source can be viewed 在 Github 上 Javascript 或 Typescript。