audio移动端不能自动播放

最新推荐文章于 2023-05-04 15:25:52 发布

都是风景幸会

最新推荐文章于 2023-05-04 15:25:52 发布

阅读量2.9k

点赞数

分类专栏：前端文章标签：前端 javascript html5

本文链接：https://blog.csdn.net/qq_17365131/article/details/122731713

版权

前端专栏收录该内容

16 篇文章 0 订阅

订阅专栏

微信内置浏览器audio不能自动播放

android、ios内部原因为了节省流量，规定不自动播放音频视频。
创建页面监听，等待微信端页面加载完毕，触发音频播放。

document.addEventListener('DOMContentLoaded', function () {
    function audioAutoPlay() {
        	$("#audio")[0].play();
			$(".music").attr('src','img/musicPlay.png').addClass('animate');
         	document.addEventListener("WeixinJSBridgeReady", function () {
             	$("#audio")[0].play();
				$(".music").attr('src','img/musicPlay.png').addClass('animate');
         	}, false);
    }
    audioAutoPlay();
});

 //--创建触摸监听，当浏览器打开页面时，触摸屏幕触发事件，进行音频播放
document.addEventListener('touchstart', function () {
     function audioAutoPlay() {
         	$("#audio")[0].play();
			$(".music").attr('src','img/musicPlay.png').addClass('animate');
     }
     audioAutoPlay();
});