<body>
<div>
<audio controls="true" autoplay="true" id="audio">
<source src="http://i.dxlfile.com/app/music/27.mp3" />
<!-- <source src="http://i.dxlfile.com/app/music/27.ogg" /> -->
<!-- <source src="http://i.dxlfile.com/app/music/27.ogg" /> -->
</audio>
</div>
<script>
var audio=document.getElementById("audio");
audio.addEventListener("canplay", function() {
console.log("canplay");
audio.play();
console.log(1111);
});
console.log(audio.canPlayType("audio/mp3"));
console.log(audio.readyState);
if (audio.readyState==0) {
console.log("readyState");
audio.play();
}
</script>
</body>
然而 手机上的 音乐状态一直 都是 不自动播放 , 必须手动点击一下才能播放
部分移动设备(IOS)浏览器有限制,需要被动(手动触摸)触发才能播放,亲测我的(Meizu)浏览器可以自动播放,(OPPO R9S)自带浏览器失败,微信内置浏览器是可以的,其它OPPO系列应该差不多,国产就是这样,都模仿,弄的我不得不吐槽了,搞的移动端和当初IE一个样儿了,真的是!
更新:
测试了一下模拟点击触发也不成功,最后无奈去apple开发者中心找了一下,发现了答案。
直接搬迁过来的原话:
用我学了长达12年的英语翻译一下“就是不可以啦,需要用户主动去触发才得行啦”。好了,我能做的就是这么多了,其实我还手动测试了一下其他hack方法,最后也以失败告终,直接解决办法就是绑定一个触摸事件给最上层容器上,用户肯定要触摸滚动之类的啊,这样不得不就触发了。