javascript - 音频持续时间返回 NaN

Question

在 Chrome 中使用 JavaScript 访问 HTML5 音频元素(.ogg 文件)。该文件确实可以正常播放，但不知何故它无法识别持续时间。

我刚刚抄写了这段代码:https://www.w3schools.com/jsref/prop_audio_duration.asp (我知道 w3schools 不是很好，但似乎还有其他问题......)

var x = document.getElementById("testTone").duration;
console.log("duration:"+x);  // duration:NaN

var y = document.getElementById("testTone");
y.play();   // works!

元素...

<audio controls id="testTone">
    <source src="autoharp/tone0.ogg" type="audio/ogg">
</audio>

Answer 1

添加preload="metadata"添加到您的标签，让它请求您的音频对象的元数据:

<audio controls id="testTone" preload="metadata">
    <source src="autoharp/tone0.ogg" type="audio/ogg">
</audio>

在您的代码中，附加一个事件处理程序，以设置 metadata has been loaded 时的持续时间:

var au = document.getElementById("testTone");
au.onloadedmetadata = function() {
    console.log(au.duration)
};