首页 > 代码库 > IOS 微信 6.5.2 自动播放音乐 解决方案

IOS 微信 6.5.2 自动播放音乐 解决方案

之前仅仅是IPhone7\7p 的问题,现在已经扩展到6 、6s。今天在下也行了最新微信,音乐问题果然来了。

好了 下面直接进入正题

 

首先 引入 

<script src=http://www.mamicode.com/"http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>

然后 

window.onload=function()
{   
    document.addEventListener("WeixinJSBridgeReady", function () {BGM.play();/*BGM.pause();*/}, false);
}

当然你要 写到$(document).ready() 也是ok的。具体项目具体设定

 

然后BGM是我自己的一个小类。主要是方便控制

暂停、播放、

自动暂停、自动播放(例如页面有视频的时候,点击视频自动停止播放背景音乐。视频关闭时自动恢复播放。如果用户已经主动关闭了背景音乐,那么视频播放完毕时 音乐仍然是暂停)

代码如下:

function objectBGM()
{
    var _S=this,userPause;
    _S.au=document.getElementById("bgm");
    _S.au.volume=1;
    
    _S.pause=function()
    {
        userPause=true;
        _S.au.pause();
        //$("#auBtn").css("background-position","-55px 0px");
    }
    _S.play=function()
    {
        _S.au.play();
        //$("#auBtn").css("background-position","0px 0px")
        userPause=false;
    }
    _S.sysPause=function()
    {
        _S.au.pause();
        //$("#auBtn").css("background-position","-55px 0px");
    }
    _S.sysPlay=function()
    {
        if(!userPause)
        {
            _S.au.play();
            //$("#auBtn").css("background-position","0px 0px")
        }
    }
    
    /*$("#auBtn").on("touchstart",function(e)
    {
        _S.au.paused?_S.play():_S.pause()
    })*/
    return _S
}

使用方式

var BGM=new objectBGM();

BGM.play();    播放

BGM.pause();    暂停

BGM.au.paused;     播放状态

 

最后可以运行完整HTML 如下:或扫描QR码测试:

技术分享

 

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="format-detection" content="telephone=no" />
<script language="javascript" id="temp">document.write(<meta name="viewport" content="width=640, initial-scale=+window.screen.width/640+,user-scalable=no, target-densitydpi=device-dpi">);
console.log("%c LUOEE.YANG luoee.yang@sigmaiii.com",background: #C82623;color: #FFF);</script>
<title>autoPlay</title>
<script src=http://www.mamicode.com/"http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
</head>

<body style="margin: 0px; background: #222; overflow: hidden;">
    <audio id="bgm" src=http://www.mamicode.com/"media/bgm.mp3" autoplay loop></audio>
    <!--ad-->
    <iframe src=http://www.mamicode.com/"http://sigmaiii.com/#640" frameborder="0" width="640" height="1010" style="position:absolute; top:0px; left: 0px; width: 640px; height: 1010px;"></iframe>
</body>
<script>
var BGM    
function objectBGM()
{
    var _S=this,userPause;
    _S.au=document.getElementById("bgm");
    _S.au.volume=1;
    
    _S.pause=function()
    {
        userPause=true;
        _S.au.pause();
        //$("#auBtn").css("background-position","-55px 0px");
    }
    _S.play=function()
    {
        _S.au.play();
        //$("#auBtn").css("background-position","0px 0px")
        userPause=false;
    }
    _S.sysPause=function()
    {
        _S.au.pause();
        //$("#auBtn").css("background-position","-55px 0px");
    }
    _S.sysPlay=function()
    {
        if(!userPause)
        {
            _S.au.play();
            //$("#auBtn").css("background-position","0px 0px")
        }
    }
    //按钮
    /*$("#auBtn").on("touchstart",function(e)
    {
        _S.au.paused?_S.play():_S.pause()
    })*/
    return _S
}
    
window.onload=function()
{
    BGM=new objectBGM()
    document.addEventListener("WeixinJSBridgeReady", function () {BGM.play();/*BGM.pause();*/}, false);
}
</script>
</html>

你可能复制到这里吧,  这是目前针对微信6.5.2的解决办法,谁知道能用几天呢?

 

IOS 微信 6.5.2 自动播放音乐 解决方案