html5中的audio标签针对IOS系统的兼容处理

最新推荐文章于 2022-06-18 23:47:18 发布

weixin_30596165

最新推荐文章于 2022-06-18 23:47:18 发布

阅读量534

点赞数

文章标签：移动开发

原文链接：http://www.cnblogs.com/caoruichun/p/7423395.html

版权

最近在写一个移动端项目,在Android设备是播放音乐没有问题,但是在苹果设备上音乐无法播放,查阅资料才知道safari默认在没有用户交互的情况下是不允许自动播放音乐的.

所以想到了用touchstart事件进行交互

代码

(function(){
        var audio = document.querySelector('#audio');
        function PlayAudio() {
               audio.load(); // iOS 9  需要load一下, 否则直接play无效
               audio.play(); // iOS 7/8 需要play一下
         }
    audio.addEventListener('play', function() {
        // 当 audio 能够播放后, 移除这个事件
        window.removeEventListener('touchstart', PlayAudio, false);
      }, false);
    window.addEventListener('touchstart', PlayAudio, false);
})();

转载于:https://www.cnblogs.com/caoruichun/p/7423395.html