HTML5音频播放在移动端有局限性，在移动版 Safari 中加载的页面上，不能自动播放音频文件。音频文件只能从用户触发的触摸（单击）事件加载。如果在 HTML 标记中使用了 autoplay 属性，那么移动版 Safari 将会忽略这个属性，并且不会在加载页面时播放此文件，避免移动端流量在不知不觉中浪费，很人性化的设计。但对HTML5应用开发者来说，这不是个好消息。

网上查找了很多资料，通过hack手段来实现自动播放是不可能的，幸运的是，我们大多数情况下是依赖微信浏览器的。这里有个方法貌似可行：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Audio auto play in mobile</title>
<script src="jquery-1.10.2.min.js"></script>
</head>
<body>
<audio preload="preload" id="car_audio" src="music.mp3" loop=""></audio>
<script>
setTimeout(function(){
$(window).scrollTop(1);
},0);

/*音乐*/
var audio = $('#car_audio');
var isPlaying = false;
function playAudio() {
var audio = $('#car_audio');
if (audio.attr('src') == undefined) {
audio.attr('src', audio.data('src'));
}
audio[0].play();
isPlaying = true;
}
$(function(){
playAudio();
document.addEventListener("WeixinJSBridgeReady", function () {
WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
network = e.err_msg.split(":")[1]; //结果在这里
playAudio();
});
}, false);
})
</script>
</body>
</html>

强调一下，只适用于微信浏览器。

测试环境：iPhone 6 ios 8.3

测试时发现的问题：如果mp3文件过大(大于2M)，有可能不会自动播放， 又换了300KB的，测试OK！

有发现更有效的方法，或者无效机型，欢迎留言！