HTML5音频标签拒绝停止播放,即使被删除后?

时间:2014-02-28 16:23:31

标签: javascript jquery html5 audio html5-audio

所以我有这个音频标签:

<audio src=".....mp3" autoplay id="aud"></audio>

20秒后,我解雇了这段代码:

var obj=$('#aud')
obj[0].volume=0;
obj[0].pause();
obj.prop('volume',0);
obj.trigger('pause');
obj.attr('src','');
obj.remove();
console.log('REMOVED!!');

但是经过这一切,音频仍在播放?

音频标记已被obj.remove()成功删除,但音频仍在继续。

console.log()正确记录。我没有错。但是,尽管使用了几种方法来静音,暂停和删除音频标签,但音频仍在继续。

任何人都可以解释原因吗?

我需要用盐和火焰清除这个音频。任何帮助都将非常感激,这正在慢慢让我疯狂......

1 个答案:

答案 0 :(得分:4)

所以当我写这个作为答案时,我摆弄了这个,我得出以下结论:

手动创建带有audio属性的autoplay标记会导致它在被添加到DOM树2次之前播放(在较旧的jquery实现上)。即使在将该元素添加到DOM树之后,通常也不可能停止两个音频流 - 当第二个流播放时,其中一个流与该元素断开连接。没有深入挖掘这一点。我在这里重现了这个问题:

http://jsfiddle.net/2gaBs/3/

当您点击Create w/o autoplay按钮时,您可以正常暂停,但是当您点击Create autoplay时,它会立即开始(甚至在添加到DOM树之前)2次!您可能没有注意到第二次播放(我也没有),因为当mp3在同一台机器上时,2音频流几乎完全同步。按Try stop将停止其中一个音频流(您需要等待5秒钟,请注意setTimeout)。

另请注意,如果你切换到jQuery ver到1.8.3或更高版本,这个问题就不再发生了,所以看来我们两个人当天都在研究旧的jQuery库^^

所以2个解决方案是:将jquery版本更新到1.8.3或更高版本,或者创建没有autoplay属性的元素并稍后启动它。