Buenas, estoy intentando realizar una función en javascript que me cargue un sonido en función de unas condiciones.
Es para la realización de unos ejercicios, de emparejamiento de preguntas y respuestas, en el caso de que emparejen la pregunta y la respuesta correcta quiero que lance un sonido (que al ser un curso de ingles, sera el sonido de la correcta pronunciación de la pregunta y la respuesta). El problema es que todo lo que he visto por ahi, ninguna me reproduce sonido alguno.
Pego aqui mi codigo Javascript
:
Código HTML:
function obtenerRadioSeleccionado(){
marcado1=-1;
for(i=0;i<document.form.grupo1.length;i++){
if(document.form.grupo1[i].checked) {
marcado1=i;
}
}
if(marcado1==-1){
return false;
}
valor1=document.form.grupo1[marcado1].value;
marcado2=-1;
for(i=0;i<document.form.grupo2.length;i++){
if(document.form.grupo2[i].checked) {
marcado2=i;
}
}
if(marcado2==-1){
return false;
}
valor2=document.form.grupo2[marcado2].value;
if((valor1==valor2)){
document.form.grupo1[marcado1].checked=false;
document.form.grupo1[marcado1].style.visibility="hidden";
document.form.texto1.style.visibility="hidden";
document.form.grupo2[marcado2].checked=false;
document.form.grupo2[marcado2].style.visibility="hidden";
document.form.texto4.style.visibility="hidden";
alert("Correcto!");
document.getElementById("sound_element").innerHTML="<embed src='tada.mp3' hidden=true autostart=true loop=false>";
}
else{
alert("Falso!");
}
}
el codigo html seria (cargo como styles lo que importo de la hoja de estilos para que veais el codigo completo)
Código PHP:
echo '<div id="sound_element"></div>';
echo "<form name='form'>";
echo '<input style="background: inherit; background-color: transparent; color:#bb5245; text-align:left; border:none; font-size: 16pt;font-weight:bold; " type="text" name="texto1" value="'.$var1.'" readonly><input type="radio" id="uno" onClick="obtenerRadioSeleccionado()" name="grupo1" value="1"> <input style="background: inherit; background-color: transparent; color:#bb5245; text-align:left; border:none; font-size: 16pt;font-weight:bold; " type="text" name="texto2" value="'.$var2.'" readonly><input type="radio" id="uno" onClick="obtenerRadioSeleccionado()" name="grupo1" value="'.$var2.'"><br/>';
echo "<input style='background: inherit; background-color: transparent; color:#bb5245; text-align:left; border:none; font-size: 16pt;font-weight:bold; ' type='text' name='texto3' value='".$var3."' readonly><input type='radio' id='dos' onClick='obtenerRadioSeleccionado()' name='grupo2' value='".$var3."'> <input style='background: inherit; background-color: transparent; color:#bb5245; text-align:left; border:none; font-size: 16pt;font-weight:bold; ' type='text' name='texto4' value='".$var4."' readonly><input type='radio' onClick='obtenerRadioSeleccionado()' id='cuatro' name='grupo2' value='1'><br/>";
echo "</form>";
Si el codigo no esta muy optimizado es que soy novato en Javascript.
Como podeis ver primero hago 2 bucles for que recorren los radio button de cada grupo para comprobar cual esta marcado, y almaceno el value de cada radio button en una variable. Si la pregunta y la respuesta son las relacionadas, el value de ambos sera el mismo por lo tanto disparo el codigo de respuesta correcta, desmarco los radio button, escondo el texto y el radio button y mando el mensaje de correcto, e intente meter esa funcion de sonido que encontre (es la cuarta distinta que encuentro y nada). El arhivo a reproducir es tada.mp3, que esta metido en la misma carpeta que la pagina que se ejecuta (la pagina es simplemente una prueba de la función para despues importar al servidor real)
Gracias por anticipado