Question

昨天我下载了一个响应式导航栏教程，发现作者使用了JavaScript的按钮点击声音。
因此，我尝试了代码（将其复制）并且也能够做到这一点。单击该按钮时，背景音乐播放良好。但是，当我尝试将相同的代码添加到主体realloc功能时，音乐无法播放。

所以，我认为代码有一些错误，但是突然我从Opera Mini for Android打开HTML文件，并出现了背景音乐。无法在高级浏览器（例如Chrome）中运行的代码在Opera Mini中运行。为什么会这样？

3/2

Answer 1

截至2018年4月，Google拥有changed their Autoplay Policy。它是在Chrome v.66中实现的。

该政策的相关摘要：

Chrome的自动播放政策很简单：



始终允许静音的自动播放。



在以下情况下允许自动播放声音
：

用户已与域互动（单击，点击等）。

在桌面上，已经超过了用户的“媒体参与指数”阈值，这意味着该用户以前曾播放有声视频。

在移动设备上，用户已将该网站添加到其主屏幕。




顶级框架可以将自动播放权限委派给其iframe，以允许自动播放声音。

我的理解方式，似乎已反映在您的体验中：如果未对用户明确要求播放音频的域进行任何操作，则Chrome浏览器会将所有自动播放的音频静音。一旦用户进行了积极的互动，规则就会变得柔和，并且媒体的播放无需经过同意即可更新。

Answer 2

您可以使用纯HTML制作第一个（背景音乐）：

<audio autoplay>
    <source src="media/background.ogg" type="audio/ogg">
</audio>

您要做的第二个操作（单击按钮）：

//JS
var Loops = new Audio("media/button_click.ogg");
//Make sure this is a GLOBAL variable.

在HTML中：

<!--HTML-->
<button id="clk" onClick="Loops.play()">Here</button>

如何使音频在人体上播放？

2 个答案: