tengo el siguiente codigo javascript
var audio = new Audio('{{ path }}'); function play() { audio.play(); } statusElement = document.getElementById("audio-status") statusElement.innerHTML = "Playing the audio" play() statusElement.innerHTML = "done playing the audio" Ahora, cuando ejecuto este código, veo que el statusElement de estado muestra "Terminó de reproducir el audio" mientras el audio aún se está reproduciendo.
Creo que esto podría deberse a que la función audio.play() se ejecuta de forma asíncrona, sin embargo, eso no es lo que quiero.
Primero quiero mostrar, "Reproduciendo el audio", y luego esperar a que se reproduzca el audio, y luego mostrar "he terminado de reproducir el audio". ¿Cómo debo hacer esto?
Hay un evento ended que puede ayudar en este caso como menciona MDN
El evento de finalización se activa cuando se detiene la reproducción o la transmisión porque se alcanzó el final de los medios o porque no hay más datos disponibles.
Así que podrías intentar algo como esto.
const audio = document.querySelector('audio'); audio.addEventListener('ended', () => { statusElement.innerHTML = "done playing the audio" }); para obtener más información, consulte los documentos here