最近一个需求是实现一个微信H5活动页,需要有背景音乐,通过H5 audio标签加入音乐后,发现手机微信打开音乐无法自动播放。
html代码如下:
<audio id="musicAudio" autoplay="autoplay" loop="loop">
<source src="img/music.mp3" type="audio/mpeg">
</audio>
解决方案,加入如下js代码:
document.addEventListener('DOMContentLoaded', function() {
function audioAutoPlay() {
var audio = document.getElementById('musicAudio');
audio.play();
document.addEventListener("WeixinJSBridgeReady", function() {
audio.play();
}, false);
}
audioAutoPlay();
});