Me preguntaba si es posible reproducir varios archivos de audio con un solo botón. A partir de ahí, quiero que el usuario pueda silenciar cada archivo de audio, para que todo se ejecute simultáneamente.
No tengo mucha experiencia con el desarrollo web back-end, por lo que un pequeño empujón en la dirección correcta sería muy apreciado.
Puede comenzar a reproducir múltiples audios con solo hacer clic en un solo botón simplemente llamando a la función de reproducción en cada audio que desee iniciar.
Este fragmento tiene un par de elementos de audio. Al hacer clic en el botón, cada uno tiene su función de reproducción llamada.
Tenga en cuenta que cada uno tiene el atributo de controles para que el usuario pueda pausarlos individualmente. (También tiene un bucle en cada uno solo para esta demostración, ya que cada audio es bastante corto).
function playAll() { document.querySelector('.container').classList.add('playing'); const audios = document.querySelectorAll('audio'); audios.forEach(audio => { audio.play(); }); } .container { display: none; } .container.playing { display: block; } <button onclick="playAll();">Play them all</button> <div class="container"> <h2>Horse </h2> <audio src="https://www.w3schools.com/html/horse.mp3" controls loop></audio> <h2>Placeholder</h2> <audio src="https://ia903002.us.archive.org/18/items/placeholder/placeholder.mp3" controls loop></audio> </div>