html audio 在iphone不能播放,H5 audio标签在ios微信上不能播放音乐

原文: http://n1.tuxi.com.cn/to/weixin/satjam/mtsahn.html

解决方案

关键就是微信的WeixinJSBridgeReady事件。这个是微信自带提供的事件，测试发现，上面说的少部分的机子微信只要做微信ready后执行播放，就可以用代码实现自动播放功能了！具体代码请看下面：

function audioAutoPlay(id){

var audio = document.getElementById(id),

play = function(){

audio.play();

document.removeEventListener("touchstart",play, false);

};

audio.play();

document.addEventListener("WeixinJSBridgeReady", function () {

play();

}, false);

document.addEventListener('YixinJSBridgeReady', function() {

play();

}, false);

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

}

audioAutoPlay('Jaudio');

后语

总结下吧，关于音乐自动播放的问题，现在可以分为三种：

1-支持audio的autoplay，大部分安卓机子的自带浏览器和微信，大部分的IOS微信(无需特殊解决)

2-不支持audio的autoplay，部分的IOS微信(本文提供的解决方案)

3-不支持audio的autoplay，部分的安卓机子的自带浏览器(比如小米，开始模仿safari)和全部的ios safari(这种只能做用户触屏时就触发播放了)

那么针对已知的三种情况，关于自动播放背景音乐的问题，我们来总结一下综合解决方案代码吧：