Продолжительность звука HTML5 с использованием jQuery

Question

Я пытаюсь получить продолжительность звука с помощью jQuery, но мне сложно его получить. Метод, который я использую, определен ниже

var audioElement = document.createElement('audio');            
        audioElement.setAttribute('src','song.mp3');            
           audioElement.play();
           var duration = audioElement.duration;
               $(".songtime").html(duration);

Но там написано nan Кто-нибудь знает, как это решить?

Answer 1

Поскольку аудио еще не загружено, вам нужно дождаться загрузки метаданных в ваш элемент, существует простой способ сделать это:

audioElement.addEventListener("loadedmetadata", function(_event) {
    var duration = audioElement.duration;
    //TODO whatever
});

Answer 2

Возможно, проблема больше не действительна, но проблема в том, что аудио еще не загружает файл.Вы должны добавить событие, когда файл загружен

 $(audioElement).on("canplay", function () {
        alert(this.duration);
    });

Answer 3

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

Answer 4

У других была эта проблема, и похоже, что Safari может быть сброшен, если ваш веб-сервер не отправляет правильные теги заголовка HTTP. У меня та же проблема - моя демонстрация загружалась и воспроизводила аудио просто отлично, но длительность всегда возвращала «бесконечность» из-за http-заголовков, которые мой локальный сервер использовал для обслуживания mp3-файла.

Основная суть в том, что тип контента должен быть следующим:

Content-Type:audio/mpeg; name="name_of_file.mp3"

Вместо:

Content-Type:application/octet-stream 

Для получения дополнительной информации см. Оригинальный пост здесь: http://groups.google.com/group/jplayer/browse_thread/thread/256d29fcc158f8ec