0

我正在使用 JavaScript 和 HTML5 制作音频播放器。现在我遇到了一个错误，当我尝试更改文件，然后根据滑块的位置播放它时， player.duration 是 NaN 因为它还没有加载那么远。如果我发出警报，那么它工作正常。所以基本上，如果浏览器只是勉强挂起，它会给它足够的时间，而当它直接运行时，它并没有首先完成加载。

player.src = file;
// The next command is reached before the full effect of the above line is finished
player.currentTime = (slider.offsetLeft) / trackWidth * player.duration;

里面还有一些其他的东西，但本质上，我需要一种方法来稍微停顿一下，或者在第二行运行之前等待一切完成。我意识到我可以在第二行使用 setTimeout，但该行在函数中的几个位置，所以我希望可以在第一行之后放置一个“一个修复”。

4

2 回答 2

2

您需要做的是等待音频的元数据可用。这可以通过等待loadedmetadata事件并在触发该事件后在回调中执行其余代码来实现。

player.addEventListener('loadedmetadata', function() {
    player.currentTime = (slider.offsetLeft) / trackWidth * player.duration;
    // and the remainder of your code relating to the audio element
}, false);

唯一的潜在问题是，如果文件加载速度非常快（即它已经在缓存中），则可能会在附加事件处理程序之前触发事件。最好src在添加事件侦听器后分配属性。

于 2013-11-06T13:01:03.080 回答
0

您可以使用setTimeout函数来运行您的代码几乎没有延迟，例如。0.5 秒。

setTimeout(function() {
    // your code
}, 500);

此外，您可以检查播放器是否已加载，如果没有，请设置新的超时以等待更长的时间。

于 2013-11-06T12:55:35.463 回答