两个基于浏览器的打字训练小游戏:主键盘与数字小键盘。字母 / 符号从天而降, 用对应按键击落目标;漏接落地则扣生命,生命耗尽即结束。
| 文件 | 说明 |
|---|---|
main-keyboard-typing-game.html |
主键盘打字游戏(字母 + 符号 + 功能键) |
numpad-typing-game.html |
数字小键盘打字游戏(0–9、.、+ - * /、Enter) |
game-core.js |
两个游戏共用的纯玩法逻辑模块(无 DOM / canvas / 音频) |
直接用浏览器打开对应的 HTML 文件即可(双击或拖入浏览器)。
注意:game-core.js 必须与两个 HTML 文件放在同一目录,否则游戏无法启动。
纯前端、零依赖、无外部资源;音效用 WebAudio 实时合成。
- 目标气泡从顶部随机水平位置下落,落到底部地面线即扣 1 点生命(共 3 点)。
- 输入与气泡上字符相同的键即可击落;同一字符多个落下时,优先击落最靠近地面的那个。
- 连击(Combo)越高,单次得分越高(
得分 = 10 × 连击数)。 - 速度 / 下落间隔会随分数缓慢提升(ramp)。
| 操作 | 按键 |
|---|---|
| 击落目标 | 主键盘 / 小键盘对应字符键 |
| 暂停 / 继续 | 空格 或 Esc(注:当某关把空格作为目标字符时,空格用于击落,暂停改用 Esc) |
| 开始 / 重开 | 界面按钮 |
控制栏还可调节:音量、静音、主题、语言(简中 / 繁中 / EN)。
两个游戏都采用统一的「1–4 级模式」,每组字符集按以下四种模式训练:
- 正序 · 每字符 10 次(
seqFwd(set, 10)) - 正序 · 不重复(
seqFwd(set, 1)) - 倒序 · 不重复(
seqRev(set, 1)) - 随机下落(
randSet(set))
共 64 级 + 自选(自定义),按 1–4 模式分组的字符集:
| 级别 | 字符集 |
|---|---|
| 1–4 | CapsLock a s d f g |
| 5–8 | h j k l ; ' Enter |
| 9–12 | LShift z x c v b |
| 13–16 | n m , . / RShift |
| 17–20 | Tab q w e r t |
| 21–24 | y u i o p [ ] \ |
| 25–28 | ` 1 2 3 4 5 |
| 29–32 | 6 7 8 9 0 - = Backspace |
| 33–36 | ~ ! @ # $ % Space |
| 37–40 | ^ & * ( ) _ + |
| 41–44 | A S D F G(大写,需 Shift+字母击落) |
| 45–48 | H J K L : "(大写+冒号/引号,需 Shift+字母/;/' 击落) |
| 49–52 | Z X C V B(大写,需 Shift+字母击落) |
| 53–56 | N M < > ?(大写+尖括号/问号,需 Shift+字母/,/.//) |
| 57–60 | Q W E R T(大写,需 Shift+字母击落) |
| 61–64 | `Y U I O P { } |
第四十一至四十四级的目标为大写字母
A S D F G,第四十五至四十八级为 大写字母 + 冒号 / 引号H J K L : ",第四十九至五十二级为 大写字母Z X C V B,第五十三至五十六级为 大写字母 + 尖括号 / 问号N M < > ?,第五十七至六十级为 大写字母Q W E R T,第六十一至六十四级为 大写字母 + 花括号 / 竖线Y U I O P { } |;大写字母与符号均需按住Shift击落(H/J/K/L/Z/X/C/V/B/N/M/Q/W/E/R/T/Y/U/I/O/P用Shift+字母、:用Shift+;、"用Shift+'、<用Shift+,、>用Shift+.、?用Shift+/、{用Shift+[、}用Shift+]、|用Shift+\);单独按小写字母 / 分号 / 引号 / 逗号 / 句号 / 斜杠 / 方括号 / 反斜杠不会命中。
特殊键显示:Enter ⏎、CapsLock ⇪、Shift ⇧、Tab ⇥、Backspace ⌫、Space ␣。
共 4 级 + 自选(自定义),保持原始字符顺序:
0 1 2 3 4 5 6 7 8 9 . Enter + - * /,同样按 1–4 模式训练。
两个游戏均提供「自选(自定义)」级别,可勾选要练习的字符、设置:
- 顺序:正序 / 倒序 / 随机
- 每字符次数
- 下落速度:慢 / 中 / 快 / 很快
- 下落方式:单个 / 多个
主键盘自定义面板列出 1–64 级出现过的全部字符(去重),按四组可勾选:字母(含大小写 a–z / A–Z)、符号(. , / ; ' [ ] \ 及 ~ ! @ # $ % ^ & * ( ) _ + \ - = : " < > ? { } |`)、数字(0–9)、功能键(CapsLock / Enter / Tab / Space / Backspace / LShift / RShift)。
界面支持 简体中文 / 繁體中文 / English,通过语言下拉框实时切换, 所有静态文本、级别名称、下拉选项均随语言变化。
game-core.js只负责纯玩法逻辑(与显示字符无关),对外暴露GameCore:createState():创建一局状态nextChar(level, seqIdx):决定下一个下落字符findTarget(items, key):命中判定(取最靠近地面的匹配项)scoreFor(combo)/applyMiss(state)/roundOf(level, seqIdx)effSpeed(level, score)/effSpawn(level, score):分数缩放的速度与间隔
- 两个 HTML 文件负责渲染(canvas)、音效(WebAudio)、DOM 与交互,
玩法逻辑全部委托给
GameCore,便于扩展新级别与新字符集。 在线体验验网址 https://typinggame.ct.ws