как удалить исходный аудиофайл в html5 аудиоплеере через javascript - PullRequest
Новая
       41

как удалить исходный аудиофайл в html5 аудиоплеере через javascript

0 голосов
/ 28 января 2020

У меня есть динамический c аудиоплеер (по умолчанию html5), где я могу установить sr c, и он автоматически воспроизводится. Это все работает. У меня также есть ссылка для удаления sr c, , но ни одна из следующих строк на самом деле не удаляет и / или не сбрасывает проигрыватель для удаления / удаления исходного аудиофайла. Если вы воспроизводите звук, затем останавливаете его и нажимаете кнопку удаления аудиофайла, плеер STILL будет воспроизводить существующий аудиофайл. Так как же удалить исходный аудиофайл из плеера в 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', '');

1 Ответ

0 голосов
/ 29 января 2020

Когда вы удаляете атрибут 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>
...