微信公众号网页退出当前页面依然播放音频(背景音乐)

步骤:
1,通过js 检测当前页面是否有音频播放
2,如果有音频播放将音频的连接,播放当前的时间点,存入缓存
3,检测当前页面如果没有音频播放,并且缓存中有音频连接,时间点,
4,在该页面添加音频,并从缓存中取出时间点自动播放
。。。。。。其它逻辑根据需求自己改吧

 var storage = window.localStorage;
        function jiance() {
            var oAudio=document.getElementsByTagName('audio')[0];
            if (oAudio){
                oAudio.ontimeupdate = function () {
                    var dizhi=$(this)[0].currentSrc;
                    var time=$(this)[0].currentTime;
                    timeUpdate(dizhi,time); 	//不断调用方法实时将当前时间放入缓存
                }
            }
        }
        function timeUpdate(url,time) {
            var yinpin=document.getElementsByTagName('audio')[0];
            if (yinpin){
                storage.setItem('url',url);
                storage.setItem("time",time);
            }else {
                if (storage.getItem("status")==0){
                    $(".tt").append(`<audio style="display: none" src="${storage.getItem("url")}" onplay="this.currentTime=${storage.getItem("time")}" autoplay controls style="width: 200px;"></audio>`);
                }
            }
        }`
 

$(".play").click(function (res) {     //播放音频
    storage.setItem('title',"title");
    storage.setItem('img',"img");
    storage.setItem('status',0);
    storage.setItem('id',id);
})
$(".pause").click(function () {    //停止音频
    storage.setItem('status',1);
})

猜你喜欢

转载自blog.csdn.net/weixin_44467587/article/details/114577627