在ios上的页面中，有时候需要一开始就进行播放音频，但是即便你加了autoplay，在js中写了start，但是它就是不播放。
很明显这个跟ios的系统有关，那么下面这种办法就可以搞定。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 |
var isAutoplay = true; var audio = document.getElementById('musicid'); // 音乐播放 function autoPlayMusic() { // 自动播放音乐效果，解决浏览器或者APP自动播放问题 function musicInBrowserHandler() { if(!isAutoplay){return false;} musicPlay(true); document.body.removeEventListener('touchstart', musicInBrowserHandler); } document.body.addEventListener('touchstart', musicInBrowserHandler); // 自动播放音乐效果，解决微信自动播放问题 function musicInWeixinHandler() { musicPlay(true); document.addEventListener("WeixinJSBridgeReady", function () { musicPlay(true); }, false); document.removeEventListener('DOMContentLoaded', musicInWeixinHandler); } document.addEventListener('DOMContentLoaded', musicInWeixinHandler); } function musicPlay(isPlay) { if (isPlay && audio.paused) { audio.play(); } if (!isPlay && !audio.paused) { audio.pause(); } } if (os=='ios'){ autoPlayMusic(); } |
当然，以上其实也是有个问题的， 如果进入页面，你想过一会儿再进行播放，你可能想在musicPlay方法中写一个setTimeout，理论上是可以的，但是经过测试，你可以延迟1秒，超过1秒，所谓自动播放就失效了，暂时还不知道原因。
那么，后面我们在开发的时候，需要结合产品设计来看，如果有这样的需求，一定要避开，必要的话可以调整一下设计。