自定义按钮控制audio停止后无法再次从头播放问题求助

• MIME类型配置错误：你的<source>标签中type属性填了audio/mp3，但MP3格式音频的标准MIME类型是audio/mpeg，部分浏览器识别错误会导致音频状态异常，触发播放失败。
• 播放逻辑未处理异常：play()方法本质是异步Promise，重置currentTime后音频会触发短暂的资源加载/seek操作，此时直接调用play如果未捕获异常，会被浏览器的媒体策略拦截，导致播放无响应。

第一步：修正audio标签的MIME类型 #

<audio id="audio1_play32" controls>
    <source src="voice/vo1.mp3" type="audio/mpeg"/>
</audio>

第二步：优化按钮点击逻辑 #

你可以直接复用行内写法，先缓存音频元素、处理播放异常，也可以根据需要在播放时主动重置进度，确保每次点击播放都从头开始：

<!-- 播放按钮：每次播放强制从头开始，捕获播放异常 -->
<img class="head-iconn" src="img/audio.png" onClick="const audio = document.getElementById('audio1_play32'); audio.currentTime = 0; audio.play().catch(err => console.error(err)); return false;" />

<!-- 停止按钮保持逻辑即可，可优化为缓存元素减少DOM查询 -->
<img class="head-icon2" src="img/audio2.png" onClick="const audio = document.getElementById('audio1_play32'); audio.pause(); audio.currentTime = 0; return false;" />

内容的提问来源于stack exchange，提问作者Jituu