HTML5 中的 Javascript 和音频 - 第一次“play()”调用后的延迟答案

【问题标题】：Javascript & audio in HTML5 - Delay after the first 'play()' callHTML5 中的 Javascript 和音频 - 第一次“play()”调用后的延迟
【发布时间】：2013-08-24 00:17:02
【问题描述】：

我对这个非常简单的 HTML5 + Javascript 代码有疑问。它会尝试在加载后直接播放声音。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Test page</title>
    </head>
    <body>

        <audio src="freedom.wav" 
               id="audio1"
               preload='auto' 
               onloadeddata="alert('the sound has been loaded !'); document.getElementById('audio1').play();"
        ></audio>

        <input type="button" value="Play it again !" onclick="document.getElementById('audio1').play();" />

    </body>
</html>

如您所见，我正在加载带有 HTML5 音频标签的声音。一旦声音完全加载，“onloadeddata”事件就会启动并执行 Javascript 代码。此代码会提示一个警报窗口并立即开始播放声音。 alert() 调用可以直观地通知我声音已成功加载。

但问题是：play() 调用有效，但声音在 alert() 窗口出现后几秒钟播放。这种延迟对我来说是个问题，因为我希望有一个指示器来告诉我声音何时可以立即播放。而且“onloadeddata”似乎不符合这些要求。

请注意，一旦第一次 play() 成功，我在进一步的 play() 调用中不会有任何延迟。我可以用“再玩一次！”来验证这一点。 button : 单击按钮后立即播放声音，第一个 play() 已通过。

谁能告诉我在第一次调用 play() 时是否有解决此延迟的方法？或者有什么方法可以告诉我什么时候可以真正播放声音？

我在谷歌浏览器上。

非常感谢！

【问题讨论】：

谷歌浏览器，最新版本。

标签： javascript html audio

【解决方案1】：

好的，问题实际上已经很好地定义了。

此错误仅发生在 chrome 上（Firefox 没有问题）
它只涉及 wav 文件
这与Javascript的play()函数无关，我直接在chrome中打开wav文件得到同样的延迟

我仍然没有找到解决此延迟的方法，而且我现在并不在意。我将使用 MP3 或 OGG 文件，这样就足够了。

干杯！

【讨论】：