javascript - HTML5 音频标签无法为 Chrome 和 Safari 中第一个未聚焦的选项卡播放声音?

标签 javascript html google-chrome audio html5-audio

每当浏览器中的选项卡可用时,无论焦点如何,我都想在我的应用程序中播放声音。我正在使用 HTML 5 音频标签来播放声音。但 chrome 和 safari 会推迟音频播放,直到用户导航或聚焦到选项卡为止。播放声音的整个音频请求在选项卡焦点时播放。当您一次听到很多声音播放时,它会变得太吵。是否可以在没有浏览器延迟特性的情况下从未聚焦的选项卡播放声音?建议我任何可用于处理这种情况的替代解决方案。提前致谢。

最佳答案

这是自 Chrome 46 以来的预期行为。为了优化浏览器性能并节省电量,Google 已禁用后台选项卡上的自动播放功能。然而,从 Chrome 47 开始,人们可以通过启用 Chrome 标志

来覆盖它

chrome://flags/#disable-gesture-requirement-for-media-playback

更新:自 Chrome 60 起,Chrome 标志不再可用(谢谢 @gordie)

没有解决方法可以允许声音在“背景”选项卡中播放。解决方案是在页面聚焦之前不播放任何声音。为此,您可以使用 window.onfocus 事件处理程序,或者最好使用 Visibility API ( more info )。

关于javascript - HTML5 音频标签无法为 Chrome 和 Safari 中第一个未聚焦的选项卡播放声音?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36562529/

相关文章:

javascript - 通过Id访问DOM元素

google-chrome - 为 chrome 添加自定义搜索引擎

JavaScript 检测播放/暂停键盘(虚拟)键

css - IE vs.Chrome CSS 优先级

javascript - 选择选项的一个值后 Controller 响应

javascript - 堆叠 <ul> 元素和其中的 <li> - 移动设计

javascript - XRegExp 通过工作 unicode 检查返回 false\p?

html - 每行 3 个框,第二行不对齐。 JSfiddle

asp.net - 如何使 HTML5 input required 属性与 .NET 一起运行?

html - 当我在其中一个上使用 "margin-top: 4px"时,如何防止兄弟 div 相互推倒?