我想只创建一个音频播放器实例

时间:2015-04-24 13:49:17

标签: javascript audio

我使用了embed标签来制作播放列表。每次单击列表的音频时都会生成播放器。当您收听所选文件然后按下列表中的其他文件时,播放器将被删除并显示新播放器。

然而,相反,我想只显示一个播放器,并重复使用它。 也许是因为我继续出现的是底部。插入之前。 我想组建一名球员。

if (agent.indexOf("chrome") != -1 || agent.indexOf("opera") != -1) {                            
            var audio = document.createElement('audio');
            audio.setAttribute('id', 'audio'); 
            audio.type = 'audio/wav';
            audio.src = files[current];
            audio.autoplay = true;

            a.setAttribute('onclick', 'playlistClick(0)');
            a2.setAttribute('onclick', 'playlistClick(1)');
            a3.setAttribute('onclick', 'playlistClick(2)');

            bottom.appendChild(pop_tit01);
            bottom.appendChild(audio);
            bottom.appendChild(mp3_player);
            bottom.appendChild(re_txt);

        } else {                                        
            var pop_tit01 = document.createElement('dl');
            pop_tit01.setAttribute('class', 'pop_tit01');

            var dt = document.createElement('dt');

            var img = document.createElement('img');
            img.setAttribute('src', 'images/img/sample_img05.jpg');

            var dd = document.createElement('dd');

            var strong = document.createElement('strong');
            var str = document.createTextNode("default");
            var strdd = document.createTextNode("click list");

            //top
            dt.appendChild(img);
            strong.appendChild(str);
            dd.appendChild(strong); 
            dd.appendChild(strdd);

            //top image             
            pop_tit01.appendChild(dt);
            pop_tit01.appendChild(dd);  

            bottom.appendChild(pop_tit01);

            a.setAttribute('onclick', 'playlistclick(0)');
            a2.setAttribute('onclick', 'playlistclick(1)');
            a3.setAttribute('onclick', 'playlistclick(2)');

            //bottom.appendChild(audio);
            bottom.appendChild(re_txt);
        }

        function playlistclick(src) {
                            var audio = document.createElement('embed');
                            audio.setAttribute('id', 'audio');
                            audio.height = "50";
                            audio.width = "400";
                            audio.controls = false;
                            audio.type = "audio/wav";

                            bottom.insertBefore(audio, re_txt);

                            current = src;
                            audio.src = files[current]; 
        }

1 个答案:

答案 0 :(得分:1)

每次输入功能时,您应该检查这些元素是否已经存在,然后再盲目创建它们。

if (agent.indexOf("chrome") != -1 || agent.indexOf("opera") != -1) { 
    // Before you start, check for an element with an "audio" ID.
    // Something similar can be added everywhere else.
    if (document.findElementById('audio')) {
        return;
    }

    var audio = document.createElement('audio');
    audio.setAttribute('id', 'audio'); 
    // ....
}