码迷,mamicode.com
首页 > 其他好文 > 详细

H5音乐播放方案

时间:2017-04-22 18:54:54      阅读:168      评论:0      收藏:0      [点我收藏+]

标签:环境   代码   jsb   事件   方案   自动   event   dev   document   

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

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

原因:

        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);

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

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

H5音乐播放方案

标签:环境   代码   jsb   事件   方案   自动   event   dev   document   

原文地址:http://www.cnblogs.com/coder-zyz/p/6748615.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!