这几天写了一个网页,想给网页加一个背景音乐,随着页面加载好自动播放,一直实现不了,也没有报错,后来查询资料原来是因为audio设置的autoplay属性,记录一下。
原本
- <audio preload autoplay loop id="music">
- <source src="/music/bg.mp3" type="audio/mpeg">
- </audio>
-
Chrome提示:DOMException: play() failed because the user didn’t interact with the document first.
原因:
Chrome等浏览器基于安全的策略,于早几年就已经停止自动播放
解决方法:
进入页面随便点击一下页面,这样用户和浏览器就产生了交互,可以开启自动播放
- <script type="text/javascript">
- window.onload = function(){
- setInterval("toggleSound()",1);
- }
-
- function toggleSound() {
- var music = document.getElementById("music");//获取ID
- if (music.paused) { //判读是否播放
- music.paused=false;
- music.play(); //没有就播放
- }
- }
- </script>
-
-
如果该文章对你有帮助的话,请留下一个赞👍把。