在 JavaScript 或 jquery 的后台页面加载时自动播放音乐答案

【问题标题】：Play the music automatically on page load in the background in JavaScript or jquery在 JavaScript 或 jquery 的后台页面加载时自动播放音乐
【发布时间】：2021-01-21 14:01:09
【问题描述】：

我正在尝试在页面加载后播放音乐或 mp3 音频我试图在页面加载后加载该功能，但只有在我单击按钮后它才起作用，音乐将开始播放代码下方

HTML

<audio id="audio1" src="bk.mp3" >
<p>If you are reading this, it is because your browser does not support the audio element.</p>
</audio>
<button onclick="playAudio()" type="button" id="pp">Play Audio</button>
<button onclick="pauseAudio()" type="button" id="pp2">Pause Audio</button>

Javascript

<script>
var x = document.getElementById("audio1"); 

function playAudio() { 
  x.play(); 
} 

function pauseAudio() { 
  x.pause(); 
} 

</script>

一旦单击按钮播放，上面的代码将播放音频，但我的观点是我需要它在加载时自动开始播放 Jquery 也一样，我尝试了不同的方法，但同样只在点击时起作用

【问题讨论】：

你不能。人们不希望未经许可就播放音频。
试试$(window).on('load', playAudio);
在没有明确用户交互的情况下播放音频和视频内容是一种不好的做法，以至于浏览器正在更新其自动播放策略（参见此处，例如：developers.google.com/web/updates/2017/09/…）

标签： javascript html jquery

【解决方案1】：

简单实现

首先，在页面中添加一个音频元素，并使用 src 属性加载音频源：

<audio src="https://www.bensound.com/bensound-music/bensound-moose.mp3"></audio>

接下来使用JavaScript监听DOMContentLoaded事件，选择音频事件并调用audio.play():

window.addEventListener("DOMContentLoaded", event => {
  const audio = document.querySelector("audio");
  audio.volume = 0.2;
  audio.play();
});

【讨论】：