想自己制作好看点的audio播放暂停按钮怎么实现?这里你需要用js来控制audio播放,然后隐藏audio面版,自己用css来制作一个美化的播放面板即可。这里来介绍下怎么用js来控制audio播放暂停。具体看下面代码:
<!-- audio标签位置 -->
<p style="text-align: center;">
<audio controls="" preload="none" src="/upload/1616382683569438.mp3" id="myaudio"></audio>
</p>
<!-- 播放暂停按钮 -->
<a href="#" onclick="control()">播放 / 暂停</a>
<a href="#" onclick="repeat()">重新开始</a>
<!-- 播放控制 -->
<script language="javascript" type="text/javascript">
function repeat() {
var audio = document.getElementById('myaudio');
audio.currentTime = 0; //重新播放
}
function control() {
var audio = document.getElementById('myaudio');
if (audio !== null) {
if (audio.paused) {
audio.play(); // 播放
} else {
audio.pause(); // 暂停
}
}
}
</script>最终效果:

通过以上代码就可以实现js控制audio音频播放了。
如果内容有帮助,就点个赞吧!
