Estoy haciendo un proyecto usando audio.
Y necesito cambiar el valor de este
const click1 = new Audio (changeAudio());Tengo estas entradas de radio para elegir con el valor que quiero usar:
<div class="sound-selector"> <input type="radio" name="sound" value="Pato" id="Duck" onClick="changeAudio()" checked> <label>Pato</label> <input type="radio" name="sound" value="Perro" id="Dog" onClick="changeAudio()" > <label>Perro</label> <input type="radio" name="sound" value="Gato" id="Cat" onClick="changeAudio()"> <label>Gato</label> <input type="radio" name="sound" value="Vaca" id="Cow" onClick="changeAudio()"> <label>Vaca</label> </div>Yo uso esta función:
function changeAudio() { if (document.getElementById('Duck').checked) {return 'url'}; if (document.getElementById('Dog').checked) {return 'url'}; if (document.getElementById('Cat').checked) {return 'url'}; if (document.getElementById('Cow').checked) {return 'url'}; }Ahora. El sonido seleccionado debe reproducirse con un botón de inicio y si he cambiado el selector con solo hacer clic, los sonidos deben cambiar sin detener la reproducción. No pude hacerlo.
Necesito algo de ayuda aquí.
Gracias.
Puedes intentar algo así. Cambié un poco su marcado para que sea de uso más general (y semánticamente preciso), y en cuanto a la parte del guión, agregué notas dentro del fragmento.
// start with iteration over your inputs: document.querySelectorAll('[name="sound"]').forEach(element => { // listen to change event: element.addEventListener('change',function() { // decide what audio to play when checkbox is checked switch (element.id) { case 'demo1': var audio = new Audio('https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3'); break; case 'demo2': var audio = new Audio('https://www.soundhelix.com/examples/mp3/SoundHelix-Song-2.mp3'); break; case 'demo3': var audio = new Audio('https://www.soundhelix.com/examples/mp3/SoundHelix-Song-3.mp3'); break; } // play audio.play(); }); }); <fieldset class="sound-selector"> <label>Demo1 <input type="radio" name="sound" id="demo1" /> </label> <label>Demo2 <input type="radio" name="sound" id="demo2" /> </label> <label>Demo3 <input type="radio" name="sound" id="demo3" /> </label> </fieldset>archivos mp3 tomados de: https://www.soundhelix.com/audio-examples