[js常用]连续播放音频 -云博客

[js常用]连续播放音频

# 前端 2024-05-05 15:07 0 28 来源：云博客

许多音频连续播放.有的时候音频过大会分成多个音频.播放的时候需要连续播放

<!DOCTYPE HTML><html><head><meta charset="UTF-8" /><title>JS</title><script src="./jquery-1.8.3.js"></script></head><body> <button onclick="changeAudio()">载入播放语音</button> <input type="button" id="tts_btns" onclick="zanting()" value="暂停"> <input type="button" id="tts_btns" onclick="jixu()" value="继续/播放"> <audio id="tts_autio_id" src=""></audio><script>var arrAudio=[]; //存放语音的地方var arrNex=0; var ttsAudio = document.getElementById(‘tts_autio_id‘); //获取语音ttsAudio.addEventListener(‘ended‘, function () { arrNex=arrNex+1; if(arrNex<arrAudio.length){ ttsAudio.src=arrAudio[arrNex]; ttsAudio.play(); return; }}, false);function changeAudio() { arrAudio=[‘http://pfks-oss-center.oss-cn-beijing.aliyuncs.com/A2722610DF1A4E8EA5A05DD0864D0539.mp3‘,‘http://pfks-oss-center.oss-cn-beijing.aliyuncs.com/A2722610DF1A4E8EA5A05DD0864D0539.mp3‘,‘http://pfks-oss-center.oss-cn-beijing.aliyuncs.com/A2722610DF1A4E8EA5A05DD0864D0539.mp3‘]; ttsAudio.src=arrAudio[arrNex];}function zanting() { ttsAudio.pause();}function jixu() { ttsAudio.play();} </script></body></html>