Как я могу получить время продолжительности звука html5

Ответ 1

В каком браузере вы пытаетесь это сделать? В некоторых браузерах duration работает не так, как нужно, возвращая NaN, как вы упомянули.

Также вы убедитесь, что аудиофайл загрузился, прежде чем пытаться получить продолжительность?

Ответ 2

var au = document.createElement('audio');
au.addEventListener('loadedmetadata',function(){
    au.setAttribute('data-time',au.duration);
},false);

Ответ 3

В вышеприведенном комментарии было упомянуто, что решение заключается в привязке дескриптора события к метаданным, загруженным событиям. Вот как я это сделал -

audio.onloadedmetadata = function() {
  alert(audio.duration);
};

Ответ 4

Я нашел эту статью, может быть удобно.

http://neutroncreations.com/blog/building-a-custom-html5-audio-player-with-jquery/

Ответ 5

Я использовал событие canplaythrough, чтобы получить продолжительность трека. У меня есть случай, когда у меня есть два игрока, и я хочу остановить второго игрока за 2 секунды до завершения первого.

$('#' + _currentPlayerID).on("canplaythrough", function (e) {   
    var seconds = e.currentTarget.duration;    
    var trackmills = seconds * 1000;
    var subTimeout = trackmills - 2000; //2 seconds before end

    //console.log('seconds ' + seconds);
    //console.log('trackmills ' + trackmills);
    //console.log('subTimeout ' + subTimeout);

    //Stop playing before the end of thet track
    //clear this event in the Pause Event
    _player2TimeoutEvent = setTimeout(function () { pausePlayer2(); }, subTimeout);

});

Ответ 6

просто audioElement.duration

Dave

Ответ 7

Решение 2018:

Вы получите undefined или NaN (а не число), когда звуковые метаданные еще не загружены. Поэтому некоторые люди предложили использовать onloadedmetadata, чтобы убедиться, что сначала загружены метаданные аудиофайла. Кроме того, большинство людей не упомянули, что вам нужно настроить таргетинг на первый индекс элемента DOM аудио с помощью [0] следующим образом:

- Vanilla Javascript:

var audio = $("#audio-1")[0];
audio.onloadedmetadata = function() {
  alert(audio.duration);
};

Если это не сработает, попробуйте это, но не так надежно и зависит от подключения пользователей:

setTimeout(function () {
    var audio = $("#audio-1")[0];
    console.log("audio", audio.duration);
}, 100);

- JQuery:

$(document).ready(function() {
   var audio = $("#audio-1")[0];
   $("#audio-1").on("loadedmetadata", function() {
       alert(audio.duration);
   }); 
});