<!--h5代码 安卓微信测试可行--><audio autoplay="true" loop="true"><source src="music/bg.mp3"></audio>
从ios 4.2开始，所有的媒体元素必须要用户操作之后才能播放，比如点击、输入动作， 这个是ios的一个安全限制
参考问题来源：iphone浏览器(三大主流浏览器) 开webApp中 audio 播放不了
通过交互动作播放media
参考文案来源：解决html5 audio iphone,ipd，safari不能自动播放问题
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> ???<title>Fake auto play html audio in iOS Safari the right way</title></head><body> ???<h1>在 iOS Safari 中假装自动播放 HTML5 audio(音乐) 的正确方式</h1> ???<p>核心原理: 通过一个用户交互事件来主动 play 一下 audio</p> ???<br> ???<br> ???<br> ???<audio id="bgmusic" autoplay preload loop controls></audio> ???<script> ???(function() { ???????function log(info) { ???????????console.log(info); ???????????// alert(info); ???????} ???????function forceSafariPlayAudio() { ???????????audioEl.load(); // iOS 9 ??还需要额外的 load 一下, 否则直接 play 无效 ???????????audioEl.play(); // iOS 7/8 仅需要 play 一下 ???????} ???????var audioEl = document.getElementById(‘bgmusic‘); ???????// 可以自动播放时正确的事件顺序是 ???????// loadstart ???????// loadedmetadata ???????// loadeddata ???????// canplay ???????// play ???????// playing ???????// ????????// 不能自动播放时触发的事件是 ???????// iPhone5 ?iOS 7.0.6 loadstart ???????// iPhone6s iOS 9.1 ??loadstart -> loadedmetadata -> loadeddata -> canplay ???????audioEl.addEventListener(‘loadstart‘, function() { ???????????log(‘loadstart‘); ???????}, false); ???????audioEl.addEventListener(‘loadeddata‘, function() { ???????????log(‘loadeddata‘); ???????}, false); ???????audioEl.addEventListener(‘loadedmetadata‘, function() { ???????????log(‘loadedmetadata‘); ???????}, false); ???????audioEl.addEventListener(‘canplay‘, function() { ???????????log(‘canplay‘); ???????}, false); ???????audioEl.addEventListener(‘play‘, function() { ???????????log(‘play‘); ???????????// 当 audio 能够播放后, 移除这个事件 ???????????window.removeEventListener(‘touchstart‘, forceSafariPlayAudio, false); ???????}, false); ???????audioEl.addEventListener(‘playing‘, function() { ???????????log(‘playing‘); ???????}, false); ???????audioEl.addEventListener(‘pause‘, function() { ???????????log(‘pause‘); ???????}, false); ???????// 由于 iOS Safari 限制不允许 audio autoplay, 必须用户主动交互(例如 click)后才能播放 audio, ???????// 因此我们通过一个用户交互事件来主动 play 一下 audio. ???????window.addEventListener(‘touchstart‘, forceSafariPlayAudio, false); ???????audioEl.src = ‘http://www.w3school.com.cn/i/song.mp3‘; ???})(); ???</script></body></html>网页嵌入音乐/视频
原文地址：https://www.cnblogs.com/chenglj/p/8185372.html