四六级听力训练器：按题组切分的倍速听力工具产品系统

该项目立项于备考 CET-4 听力阶段。当时所有现成播放器都只能整段播放音频，一套真题听下来要反复拖动进度条找题，练习效率很低。目标是做一个把真题音频按题组切开的播放器，做到点哪题就从哪一秒开始，并且把逐档提速这个训练方法直接做进交互里，让练习节奏不依赖自律。

1、题组切分模块：把一套听力真题按音频内容切成 8 个独立题组（新闻 1-3、长对话 1-2、短文 1-3），每个题组绑定题目编号区间与精确时长。
2、点题直达模块：点击题组卡片，播放器直接从该题组起始秒开始播放，不需要拖动进度条定位。
3、倍速控制模块：提供 1.0 到 2.0 倍速六档，支持数字键直接切换、上下键微调，切换后当前播放位置保持不变。
4、自动连播模块：一个题组播放结束后自动切换下一题组并继续播放，可用于整卷连续听；也可一键关闭改为手动。
5、键盘与焦点模块：所有按钮按下时不夺取焦点，保证空格、方向键、字母快捷键始终由播放器接收，避免焦点停在按钮上导致快捷键失效。
6、进度记忆模块：按题组分别记录播放位置，关闭页面后再次打开可从上次位置继续。
7、题组完成标记：听过的题组自动标记，便于确认当前进度。

我独立负责该项目的全部环节：需求梳理、交互设计、前端实现与音频切分。
1、交互设计：把逐档提速的训练方法拆解为界面元素，确定题组卡片、倍速档位、自动连播开关的交互优先级。
2、音频切分：按原文内容定位每个题组的起始时间点，产出 8 个独立音频文件与对应时间码，误差控制在 1 秒以内。
3、前端实现：使用原生 JavaScript 操作 HTML5 Audio，无任何框架与第三方库，单文件交付。
4、焦点与键盘处理：在按钮上阻止 mousedown 默认行为，解决点击后快捷键被按钮吞掉的问题；键盘事件统一绑定在 document 上。
5、状态持久化：使用 localStorage 按题组键名分别存储播放进度，避免相互覆盖。
6、技术难点：音轨切换时保持倍速与进度不丢失；用 ended 事件驱动题组自动推进，而不是轮询 currentTime。