下面是编程之家 jb51.cc 通过网络收集整理的代码片段。编程之家小编现在分享给大家，也给大家做个参考。
今天做一个登陆页面的时候，网页里有个自动播放的视频背景，但是必须切换到一个视频时必须手动播放加了 autoplay="autoplay"也不行，视频并没有自动播放，按一下 F5 才会自动播放。最后，找资料发现，添加 muted 属性，也就是静音，就可以自动播放。
<video width=100% height=100% controls autoplay muted>
<source src="video/7.Ogg" alt="Second slide" style="width: 100%">
</video>
以上点 PC 桌面浏览器，HTML5 标签 audio 的 autoplay 属性可以设置在页面打开后自动播放。这个属性本来挺好的。但是最近做了一个项目却发现在 iphone 上无法自动播放。各种查阅资料后发现原来 iphone 公司是考虑到用户可能是用手机流量访问的情况，为了用户流量着想，所以需要用户交互后才能播放。虽然苹果公司是出于好心，但是如果网页打开之后还需要一个交互才能听到美妙的背景音乐，那么网站的体验效果自然差了很多。可是这种问题要怎么解决呢？冥思苦想了很久，终于做了一个艰难的决定。于是乎就这样尝试了一下：
$(function(){
$("#audio")[0].play();
})
没想到竟然好用！！！全部的代码是这样：
<html>
<head>
<script src="js/jquery.js"></script>
</head>
<body>
<audio id="audio" src="song.mp3" autoplay="autoplay">
</audio>
<script type="text/javascript">
$(function(){
$("#audio")[0].play();
})
</script>
</body>
</html>
这里需要注意的是.play()方法是 element 的方法，所以需要 dom 节点，亲测 iphone 可用。
以上是编程之家(jb51.cc)为你收集整理的全部代码内容，希望文章能够帮你解决所遇到的程序开发问题。如果觉得编程之家网站内容还不错，欢迎将编程之家网站推荐给程序员好友。
原文链接：https://www.f2er.com/html/536371.html