我有一个动态音频播放器(默认为html5),可以在其中设置src并自动播放。一切正常。我也有一个删除src的链接,但实际上以下几行都没有删除和/或重置播放器以删除/删除源音频文件。如果您播放音频,然后停止它并单击删除音频文件,则播放器仍会播放现有的音频文件。所以如何在javascript中从播放器中删除源音频文件?
jQuery('#audioPlayer"').replaceWith('<img id="audioPlayer" src="">');
jQuery('#MP3').replaceWith('<img id="MP3" src="">');
var mediaPlayer1 = document.getElementById("audioPlayer");
var mediaPlayer2 = document.getElementById("MP3");
mediaPlayer1.src ='';
mediaPlayer1.removeAttribute("src");
mediaPlayer1.load();
mediaPlayer2.src ='';
mediaPlayer2.removeAttribute("src");
mediaPlayer1.attr('src', '')
mediaPlayer1.children('source').prop('src', '');
mediaPlayer2.children('source').prop('src', '');
[删除src
属性时,就是从src
元素的HTML表示中删除audio
。
底层JavaScript HTMLAudioElement
仍具有src
属性,因此只需删除src
属性。
原生JavaScript的最小解决方案是document.getElementsByTagName('audio')[0].src = '';
当然,在执行此操作之前,您不应该将audio
标记替换为img
标记
document.getElementById('removeSourceProperty').addEventListener('click', function() {
document.getElementsByTagName('audio')[0].src = '';
});
document.getElementById('removeSourceAttribute').addEventListener('click', function() {
document.getElementsByTagName('audio')[0].removeAttribute('src');
});
<audio controls="controls" src="https://cdn.bitdegree.org/learn/I_Cactus_-_05_-_ruby_cactus.mp3?raw=true"></audio>
<div>
<button id="removeSourceAttribute">Remove source attribute (HTML only)</button>
<button id="removeSourceProperty">Remove source property (Works!)</button>
</div>