javascript - Javascript音频功能不起作用

Question

我在使用此javascript代码时遇到问题。在我的网站上，我在div中有一个音频播放器(该播放器是通过js定制的)，并且运行良好，这些是用于在页面上显示播放器的说明:

<div id="pers_player_footer">
<script src="../audiojs/audio.min.js"></script>
<script>
audiojs.events.ready(function() {
var as = audiojs.createAll();
});
</script>
<audio src='../songs/empty.mp3' id='player' preload='auto' autoplay='true'/>
</div>

我的播放器以一首空歌开头。当我想播放特定的歌曲时，将执行riproduci()函数，并传递link参数以更改src音频标签。这是我的js函数:

function riproduci(link) {
document.getElementById("pers_player_footer").innerHTML = "<script 
src='../audiojs/audio.min.js'></script>
<script>audiojs.events.ready(function() {var as = audiojs.createAll();});
</script><audio src='"+link+"' id='player' preload='auto' 
autoplay='true'/>";
}

结果是:正确编写了新代码，歌曲开始正确播放，在我的div中，旧播放器消失了，但是新播放器没有消失，留下了空白。这怎么了

Answer 1

对脚本进行小的更改，如下所示:

<div id="pers_player_footer">
<script src="../audiojs/audio.min.js"></script>
<script>
    audiojs.events.ready(function() {
        var as = audiojs.createAll();
        // yeah I know, globals suck
        window.audio = as[0];
    });
</script>
<audio src='../songs/empty.mp3' id='player' preload='auto' autoplay='true'/>
</div>

然后您可以将功能更改为

function riproduci(link) {
    audio.load(link);
    audio.play();
}

是的，我知道全局变量很烂，但是如果没有更多原始代码的上下文，这将是很好的