音频加载失败主因是路径错误、MIME不匹配或浏览器自动播放策略限制；须在用户交互后调用play()并加catch处理，MP3为首选格式，时长控制在0.3–0.6秒，禁用循环与高音量，移动端需确保首次播放由手势触发。
audio 元素加载失败时常见报错
直接写 <audio src="error.mp3"></audio> 但没声音，大概率是路径错、MIME 类型不匹配，或浏览器策略阻止自动播放。Chrome 等现代浏览器默认禁止无用户交互的音频自动播放，play() 会直接抛出 NotAllowedError。
用 JavaScript 触发错误提示音的正确姿势
必须等用户有明确操作（比如点击“提交”或“下一题”）后再调用 play()，否则会被静音。推荐在答题校验逻辑后立即播放：
const errorAudio = new Audio('assets/sounds/error.mp3');
// 假设这是判断答案错误后的回调
if (!isCorrect) {
errorAudio.currentTime = 0; // 防止重复触发时卡在末尾
errorAudio.play().catch(e => console.warn('音频播放被阻止:', e.name));
}
-
currentTime = 0很关键——否则连续错两次，第二次可能因已播到结尾而无声 -
catch必须加，否则控制台报错且不提示原因 - MP3 是兼容性最稳的格式；避免用 WAV（体积大）、OGG（Safari 支持不稳定）
如何让音频真正“提示”而非“干扰”
答题场景下，用户注意力在题目本身，音频只是辅助反馈。别用长音效、循环或高音量：
- 剪辑音频时控制在 0.3–0.6 秒内，结尾带自然衰减
- 避免使用
loop=true，也不要在onended里自动重播 - 如果页面支持静音开关，记得把
errorAudio.muted = isMuted同步进去 - 移动端需注意：iOS Safari 要求音频首次播放必须由用户手势触发，不能靠
setTimeout延迟模拟
备用方案：当 audio API 不可用时降级处理
有些环境（如微信内置浏览器旧版本）对 Audio 构造函数支持差，或禁用 Web Audio API。可简单 fallback 到 <audio> 标签 + load() + play()：
立即学习“前端免费学习笔记（深入）”；
const el = document.getElementById('error-audio');
el.src = 'assets/sounds/error.mp3';
el.load();
el.play().catch(() => {
// 完全失败时，至少给个视觉反馈
showVisualAlert('×');
});
这时候 <audio id="error-audio" style="display:none"></audio> 就得提前埋好——别等 JS 动态创建，否则 iOS 可能拒绝加载。
