天天看点

移动端 微信 音乐自动播放

微信中的音乐自动播放

//全能方法
//音乐自动播放
            $(document).ready(function(){
                autoPlayMusic();
                audioAutoPlay();
            });
            function audioAutoPlay() {
                var audio = document.getElementById('yourid');
                audio.play();
                document.addEventListener("WeixinJSBridgeReady", function () {
                audio.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('#yourid');
                if (isPlay && media.paused) {
                    media.play();
                }
                if (!isPlay && !media.paused) {
                    media.pause();
                }
            }
            //控制播放暂停
            var media = document.querySelector('#yourid');
            $('#audio').click(function(event) {
                if($(this).hasClass('running')){
                    $(this).removeClass('running')
                    media.pause()
                }else{
                    $(this).addClass('running')
                    media.play()
                }
            }); 
           
// 方法一
        var media = document.getElementById("audio");
        if (typeof WeixinJSBridge == "object" && typeof WeixinJSBridge.invoke == "function") {
            WeixinJSBridge.invoke('getNetworkType', {}, function (res) {
                // 在这里拿到 e.err_msg, 这里面就包含了所有的网络类型
                // alert(res.err_msg);
                media.play();
            });
        }
           
// 方法二
        function audioAutoPlay(id){
            var audio = document.getElementById(id),
                play = function(){
                    audio.play();
                    document.removeEventListener("touchstart",play, false);
                };
            audio.play();
            document.addEventListener("touchstart",play, false);
        }

        document.addEventListener("WeixinJSBridgeReady", function () {
           audioAutoPlay('audio');//给个全局函数
        }, false);
        document.addEventListener('YixinJSBridgeReady', function() {
            audioAutoPlay('audio');//给个全局函数
        }, false);
        audioAutoPlay('audio')