1、结构(字符串拼接的)
<div class="btn-audio">
<audio id="mp3Btn" class="mp3Btn"><source src="${list.voice}" type="audio/mpeg" /> </audio>
</div>
2、方法
$(function () {
//播放完毕
let audio = '';
//播放器控制
$('body').on("click", ".btn-audio", function () {
event.stopPropagation();// 防止冒泡
audio = document.getElementById('mp3Btn');
if (audio.paused) { // 如果当前是暂停状态
$(this).css({ 'background': 'url(images/voice_play.gif) no-repeat center bottom'});
audio.play(); // 播放
console.log('播放')
} else {// 当前是播放状态
$(this).css({ 'background': 'url(images/voice_stop.png) no-repeat center bottom'});
audio.pause(); // 暂停
console.log('暂停')
}
audio.onended = function () {
$('.btn-audio').css({ 'background': 'url(images/voice_stop.png) no-repeat center bottom' });
console.log('视频播放完了')
};
})
})