微信H5 audio 实现自动播放 IOS audio无法自动播放解决

相对于H5 音乐播放大家都很熟悉 也是很简单

<audio id="musicfx" loop="loop" preload src="img/First Girl.mp3"></audio>

如果想要自动播放呢 加上 autoplay="autoplay"即可  ! 但是会出现个问题:

ios系统的 无法自动播放 就是不支持呗 那就要另寻他路

改了使用微信的JS 來实现了 在JSAPI 的WeixinJSBridgeReady内 生效播放

window.onload = function () {
    const _audio = document.getElementById('musicfx')
	document.addEventListener("WeixinJSBridgeReady", function () {
		_audio.play();
	}, false)
}

完美解决ios 自动播放的问题

另外 还有出现触摸播放的需求也 一并献上代码

document.addEventListener("touchstart", function(e) {
	_audio.play()
}, false)
posted @ 2020-10-09 11:14  悟空dong  阅读(669)  评论(0编辑  收藏  举报