<Audio> отступление через Javascript - PullRequest
1 голос
/ 06 июня 2011

Я хочу понять, как реализовать отступление HTML5 <audio> с помощью Javascript ...

т.е. У меня есть div на моей странице, к которому я динамически добавляю тег <embed>, когда в данный момент нажимается ссылка «Play audio». то есть я сейчас использую

function playSound(audioUrl)
{
var x = document.getElementById("playAudio");
x.innerHTML = '<EMBED src="'+audioUrl+'" autostart=true loop=false volume=100 hidden=true>';
} 

Я хочу, чтобы то же самое было реализовано с использованием тега HTML5 <audio>, но я хочу использовать запасной вариант для встраивания, когда аудио тег HTML5 не поддерживается. Как я могу реализовать то же самое с помощью JS, учитывая, что URL-адрес аудио является динамическим?

Мое намерение состоит в том, чтобы оно работало как на старых, так и на новых браузерах .. как IE6,7,8; FF 3,4; Хром; Safari 4,5 на MAC, Safari на iPad ..

1 Ответ

4 голосов
/ 06 июня 2011

Вы можете использовать Modernizr для определения поддержки audio.

Если вы не хотите включать эту библиотеку для простой вещи, это следует сделать ...

var audioSupport = document.createElement('audio').hasOwnProperty('src');

jsFiddle .

Так что это будет ...

function playSound(audioUrl) {
    var audioSupport = document.createElement('audio').hasOwnProperty('src'),
        x = document.getElementById("playAudio");

    if (audioSupport) {
        var audio = document.createElement('audio');
        audio.src = audioUrl;
        x.appendChild(audio);
        audio.play();
    } else {
        // Or you could use proper DOM methods...
        x.innerHTML = '<EMBED src="' + audioUrl + '" autostart=true loop=false volume=100 hidden=true>';
    }
}

jsFiddle .

...