H5音乐播放方案

环境：移动端、浏览器、微信

问题：音乐不自动播放问题

原因：

1、微信端（前置条件添加音乐的时候一定要设置自动播放），有的时候同一款手机、统一个微信版本，会出现音乐不自动播放的问题，无解~~~~~~~（未找到原因）

2、浏览器，目前以Safari为代表的很多浏览器默认会禁止掉音乐自动播放

解决办法：

直接上代码

HTML

<audio src="music.mp3" id="audio" autoplay preload controls loop="loop"></audio>

Script

var audio = document.getElementById(‘audio‘);
       var play = function(){
             audio.play();
             document.removeEventListener(‘touchstart‘ , play , false);
        };
        document.addEventListener(‘WeixinJSBridgeReady‘ , function(){
             play();
        });

document.addEventListener(‘touchstart‘ , play , false);

微信端手动去监听微信加载完成事件

浏览器端去监听手动滑动事件