HTML: аудиофайл не обновляется при перезагрузке
У меня есть аудиофайл sound.wav длиной 14 секунд. Когда пользователь нажимает кнопку, URL-адрес источника sound.wav изменяется, и sound.wav перезагружается и теперь длится 7 секунд.
Однако мой браузер не отображает изменения. Только после нажатия кнопки обновления отображаются изменения.
Вот мой код:
<div id = "audioContainer">
<audio id = "myAudio" controls>
<source id = "wav_src" src = "http://localhost:3000/sounds/sound.wav" type = "audio/wav">
</audio>
</div>
//user clicks button... sound.wav's url source is changed
document.getElementById("myAudio").load(); //code to reload the sound.wav
Как видите, я перезагружаю аудиоэлемент html для sound.wav после того, как пользователь нажимает кнопку. Однако звуковой файл остается неизменным на веб-сайте, если я не нажму «Обновить».
Как я могу это исправить?
Вы намеренно меняете продолжительность? Или у вас разные wav файлы?
Поскольку вы используете элемент <source>, вы должны вызвать метод <audio>.load() после того, как вы изменили src вашего источника.
Это обман stackoverflow.com/questions/32168173/…, у которого нет ответа, за который проголосовали ...
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Когда вы меняете src элемента <source>, он не меняет src его родительского элемента MediaElement (<audio> или <video>). Вы должны вызвать этот метод MediaElement .нагрузка():
set_src.onclick = function() {
source.src = 'http://cdn.music2ten.com/mp3/pd4u/GershwinWhiteman-RhapsodyInBluePart1.mp3';
console.info('source src:', source.src);
setTimeout(function(){console.info('audio src:', audio.currentSrc)});
}
load_btn.onclick = function() {
audio.load(); // you must call this
setTimeout(function(){console.info('audio src:', audio.currentSrc)});
};<audio id = "audio" controls = "controls">
<source id = "source">
</audio>
<br>
<button id = "set_src">set src</button>
<button id = "load_btn">load</button>Конечно, вы обычно делаете это за один раз:
set_src.onclick = function() {
source.src = 'http://cdn.music2ten.com/mp3/pd4u/GershwinWhiteman-RhapsodyInBluePart1.mp3';
audio.load(); // you must call this
}<audio id = "audio" controls = "controls">
<source id = "source">
</audio>
<br>
<button id = "set_src">set src</button>
Где
//code to reload the sound.wav? Это функцияload()?