如何在javascript中删除动态创建的音频元素？

Question

我每 30 秒刷新一次脚本以检查更改。返回的数据设置音频元素的 src。

如果数据已更改，我将 src 属性更改为匹配，但 onClick - 我听到 两个 音频文件一起播放。

这里发生了什么，如何删除之前的音频文件？

(function fetchCal() {
$.getJSON('events', function(data) {

//I need to clear any previously created elements here

  var nowAudio = document.createElement('audio');
  nowAudio.setAttribute('src',"audio/"+data.uid+"."+data.nowTitleURL+".mp3" );

  $('.now').click(function() {
      nowAudio.play();
  });

})
setTimeout(fetchCal, 30000); //refresh calendar every 30 secs
})();

注意：$( "audio" ).remove(); 不起作用

Answer 1

您将多个 clcicks 绑定到同一个元素，因此它将始终具有先前的单击事件。你需要解绑它。

$('.now').off("click.audio").on("click.audio", function() {
  nowAudio.play();
});