appendChild не работает с управлением звуком

Я динамически создаю элемент управления звуком и пытаюсь показать его в форме с элементами управления. У меня есть div в форме (я пробовал с div, td, span), и я уверен, что у меня правильный идентификатор. Я использую appendChild (аудио). Если я поставлю alert() непосредственно перед завершением функции, элемент управления звуком начнет воспроизведение файла. Как только функция выходит, аудиоплеер останавливается, и я никогда не вижу отображаемого элемента управления. Что мне не хватает? Кажется очевидным, что переменная audio теряет область действия и больше не действует. Но почему я не могу добавить его в свой div, td или span? (у меня файрфокс, так что играет ogg)

Изменить - я полагаю, я должен упомянуть, что это вызывается из

HTML:

<a onclick="CreateAudio($oggfile, $id)">Play</a>

JavaScript:

function CreateAudio(oggfile, id)
{ 
var audio = document.createElement('audio');

var source= document.createElement('source');
source.type= 'audio/ogg';
source.src= oggfile;
audio.appendChild(source);

mp3file = oggfile;  // I will fix this to replace ogg extension with mp3
source= document.createElement('source');
source.type= 'audio/mpeg';
source.src= mp3file;
audio.appendChild(source);

var div = document.getElementById(id);
div.appendChild(audio);

audio.load;
audio.play();

}

person mseifert    schedule 14.09.2013    source источник


Ответы (1)


Аудиоэлемент, который вы изначально создали, теряет область действия после завершения функции. Вам потребуется доступ к аудиоэлементу, который находится в DOM.

audio.setAttribute("id", "myAudioClip")
var div = document.getElementById(id);
div.appendChild(audio);
var audioElement = document.getElementById("myAudioClip");

audioElement.load();
audioElement.play();
person Max Hartshorn    schedule 14.09.2013
comment
К сожалению, я неграмотен в jQuery. Я не знаю, как интегрировать это с моим кодом. Я использовал (предположительно рабочие) примеры, взятые из разных сообщений, которые не были jQuery. Спасибо за предложение. - person mseifert; 14.09.2013
comment
Вам не нужен jQuery. Я обновил свой ответ, чтобы он не использовал jQuery. - person Max Hartshorn; 14.09.2013
comment
Я считаю, что audio.load(); аудио.играть(); должно быть с новым audioElement var. Однако управление звуком по-прежнему теряет объем. Я добавил audioElement.controls = true; так что теперь я могу видеть элемент управления, прежде чем он исчезнет... - person mseifert; 14.09.2013
comment
Я упростил код до основ, так как решил, что он должен работать. Вуаля, управление звуком не теряет объема. Баг в другом. Я обновлю, когда найду. - person mseifert; 14.09.2013