HTML 5 - Воспроизведение крошечного mp3 "inline" - PullRequest
Новая
       33

HTML 5 - Воспроизведение крошечного mp3 "inline"

5 голосов
/ 02 января 2012

Я хочу воспроизвести mp3, используя поддержку аудио HTML 5.Я пытался использовать звуковую метку, но теперь я делаю это, используя javascript.

Мой «Плеер» будет просто крошечным изображением воспроизведения, которое при нажатии воспроизводит звук (не все элементы управления аудиосистемой с прогрессом).

Я пытаюсь воспроизвести его с помощью JavaScript. 

function playmp3(url){
   var audioElement = document.createElement('audio');
   audioElement.setAttribute('src', url);
   audioElement.load();
   audioElement.play();
}

Это мой код, и он не работает.Он работает нормально, когда я нажимаю на изображение, которое является моей кнопкой Play.

Url - это строка, содержащая URL-адрес файла.

Я тестирую в новейших версиях Chrome и FF.

1 Ответ

4 голосов
/ 03 января 2012

Попытка прослушивания события canplay перед попыткой воспроизведения mp3.Вот пример того, как это сделать: 

function playmp3(url){
    var audioElement = document.createElement('audio');
    audioElement.setAttribute('src', url);
    audioElement.load();
    audioElement.addEventListener("canplay", function() {
        audioElement.play();
    });
}

Событие canplay наступает, когда браузер может начать воспроизведение mp3, но это не гарантирует, что он может воспроизвести mp3 до завершения.Если это не соответствует вашим целям, есть несколько других связанных событий, которые вы можете прослушать, например loadeddata и canplaythrough.

...