javascript - appendChild无法使用音频控件

标签 javascript audio appendchild

我正在动态创建音频控件,并尝试在带有控件的表单上显示它。我在表格上使用了div(我已经使用div,td,span对其进行了尝试),我很肯定我的ID正确。我正在使用appendChild(audio)。如果在函数结束前放置了alert(),则音频控件将开始播放文件。该功能退出后,音频播放器就会停止运行,并且我再也看不到控件的显示。我想念什么?音频变量似乎失去作用域,并且不再有效。但是,为什么不能将其追加到div,td或span呢? (我在Firefox中,因此正在播放的是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();

}

最佳答案

功能完成后,最初创建的音频元素将失去作用域。您需要访问DOM中的音频元素。

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

audioElement.load();
audioElement.play();

关于javascript - appendChild无法使用音频控件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18798402/

相关文章:

javascript - 如果 div 不存在,则将 HTML append 到该 div 中

audio - 如何识别不同视频流和音频流的rtmp数据包

javascript - 每页上的音量按钮控制

javascript - 处理器音频JavaScript HTML5

javascript - appendChild 不起作用

javascript - AngularJs 上传按钮功能

javascript - HTML5 Canvas 和滚动

javascript - 检查 javascript 函数中的 php 变量

javascript - Angularjs 将变量传递给具有继承(非隔离)范围的指令

java - 在java中追加子项后如何保存xml