防止 Three.js 街机游戏中因焦点丢失导致的蓄力跳跃意外触发
来源：dev.to/sunnhappy
📋 概述
Solstice Leap 是一款 Three.js 街机游戏，玩家按住按键蓄力、松开跳跃。但切换浏览器标签或 Alt+Tab 时，游戏将 blur 事件误判为玩家刻意松开了跳跃键，导致角色自动跳跃——消耗日光、打断连击或直接结束游戏。修复方案是将两种结果分离：刻意松开的输入事件（keyup/pointerup）触发跳跃，浏览器焦点丢失（blur）则取消蓄力、不做跳跃判定。核心教训：blur 不是输入释放事件，它只表示应用失去焦点，不表示玩家做出了任何操作。
🔑 核心要点
- blur ≠ 输入释放：浏览器失去焦点与玩家提交操作是两件完全不同的事。
- bug 重现：按住蓄力→切换窗口→返回→角色已自动跳跃并失败。
- 修复：分离 刻意释放（keyup/pointerup）和焦点丢失（blur），前者触发跳跃、后者取消蓄力。
- 对一个街机游戏而言，输入状态的正确性直接影响游戏公平性和用户体验。
💡 金句
blur is not an input-release event. It tells the application that it has lost focus, not that the player has committed to a charged jump.
← 返回 Dev.to 首页