移动端H5 消息通知提示音案例

var canAutoPlay = true;//默认允许浏览器播放，PC端的就是。
var isShowPlayMsg=0;// 0->2表示浏览器自动允许播放，1->2表示手动点击浏览器后触发的
function audioInit(audio2){//初始化声音，初始化完后直接静音。
audio2.loop=true;
audio2.play().then(function(){if(isShowPlayMsg==1){toast('激活语音提示成功');}isShowPlayMsg=2;canAutoPlay=true;console.log('激活成功');$('.active_music').hide();}).catch(function(){isShowPlayMsg=1;canAutoPlay=false;console.log('初始化失败啦！');});
audio2.muted=true;
}

function play(audio2){//需要的地方直接调用play(audio)
audio2.currentTime=0;
audio2.muted=false;
setTimeout(function(){audio2.muted=true;},audio2.duration*1000);//播放完后静音，不暂停。
}

const audio = new Audio("../assets/audio/1.mp3");//加载声音

document.addEventListener('click', function(event) {
  // 处理点击事件的代码
  if(!canAutoPlay){
    audioInit(audio);// 点击页面即初始化声音。
  }
});
//尝试浏览器加载时初始化
 audioInit(audio);
//如果初始化失败了，则点击页面的时候进行初始化。