美文网首页
微信内置浏览器音频自动播放问题

微信内置浏览器音频自动播放问题

作者: 秃头大叔 | 来源:发表于2017-12-19 11:19 被阅读0次

    Html5的audio 音频在iphone上无法实现,针对的是微信浏览器、易信、APP一些不支持设备里面的解决方法

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

    // 二
    // 音乐播放
    function autoPlayMusic() {
    // 自动播放音乐效果,解决浏览器或者APP自动播放问题
    function musicInBrowserHandler() {
    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) {
                    var media = document.querySelector('#media');
                    if (isPlay && media.paused) {
                        media.play();
                    }
                    if (!isPlay && !media.paused) {
                        media.pause();
                    }
                }
    

    ···

    循环播放

      // 音乐播放
                    
                    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);  
    
                        audio.addEventListener('ended', function () {  
                  //循环
                              audio.load();
                              audio.play();                     
                        }, false);  
    
    
                        // setInterval(function(){
                        //     // audio.src = "../../music/Two Steps From Hell - Victory.mp3";
                        //     audio.load();
                        //     audio.play();        
                        // },35000);
    
                    }  
                    audioAutoPlay('media'); 
    

    相关文章

      网友评论

          本文标题:微信内置浏览器音频自动播放问题

          本文链接:https://www.haomeiwen.com/subject/bkjbwxtx.html