移动端音频自动播放相关

项目背景：app中的H5页面需要添加背景音乐 

 <audio id="audio" preload="auto" autobuffer="autobuffer" loop="loop" src="music.mp3"></audio>

 问题：部分手机不支持autoplay属性（safari屏蔽了autoplay，安卓的部分手机），在页面加载时调用audio.play()部分手机也会被拦截 

 妥协解决方案：在用户的交互动作后，音频是允许播放的 可接受方案就是在用户的随机操作时，播放音乐，在页面监听touch事件

$('body').one('touchstart',function(e){

       e.preventDefault(); 

       audio.play();

}); 

部分安卓8系统的手机touchstart事件也不允许播放音频，所以再监听一下touchend

 $('body').one('touchend',function(){ //start事件也不触发play 

     audio.play(); 

});

one()方法限定绑定事件只执行一次，防止之后的用户误操作

转载于:https://juejin.im/post/5b45d2e551882569fd285963