在iPad上用HTML5 audio实现声音的自动播放

发现在mac上的safari用HTML5的audio标签实现声音的自动播放是ok的,但是在iPad上则不ok,但是研究查找了一番之后,用如下的方法搞定。

在iPad上用HTML5 audio实现声音的自动播放

<audio id="bg-player" src="/upload/example.mp3" loop preload="true" autoplay="true" controls></audio> <script type="text/javascript"> function fakeClick(fn) { var $a = $('<a href="#" id="fakeClick"></a>'); $a.bind("click", function(e) { e.preventDefault(); fn(); }); $("body").append($a); var evt, el = $("#fakeClick").get(0); if (document.createEvent) { evt = document.createEvent("MouseEvents"); if (evt.initMouseEvent) { evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null); el.dispatchEvent(evt); } } $(el).remove(); } $(function() { var audio = $("#bg-player").get(0); fakeClick(function() { audio.play(); }); }); </script>

虽然现在很多浏览器都支持了audio标签,但尤其在移动设备上还是有区别的,比如android上也无法自动播放,然后通常的做法是在touchstart事件里,调用audio.play方法则ok。

相关阅读