Buenos días a todos.
He buscado todos los temas relacionados con setTimeout, y, a menos que me haya saltado algo sin querer, no he encontrado nada relacionado con mi problema.
He creado un cronómetro cuenta atrás para aproximar los descansos del personal, que voy a colgar en una web corporativa, y no tengo forma de conseguir que funcione con Firefox. Sin embargo, funciona a la perfección con Internet Explorer.
He estado leyendo muchos temas en otros foros, y hablan de los tipos de variable que se usan y de la forma de declararlas, así como de la forma en que se utiliza el setTimeout.
He probado a cambiar todas las variables a global, para evitar problemas de acceso a estas desde dentro o fuera de la función que controla "el paso del tiempo". El resultado es el mismo.
He probado a definir el setTimeout de todas las maneras que he leido y se me han ocurrido que podrían funcionar, pero la única declaración que ha funcionado es la que os adjunto a continuación, con el resto del código.
Código:
<html>
<head>
<script type='text/javascript'>
horsum=0;
minsum=0;
segsum=0;
horvar=0;
minvar=30;
segvar=0;
runvar=1;
toVar;
function cdfunc (hora, minu, segu){
//alert(segu + minu + hora);
if (runvar==1){
if (segu + minu + hora == 0){
document.getElementById('cronos').innerHTML=segu;
horvar=horsum;
minvar=minsum;
segvar=segsum;
alert("Has agotado el tiempo!!");
document.setime.cdgo.disabled=false;
document.setime.hor.disabled=false;
document.setime.min.disabled=false;
document.setime.seg.disabled=false;
document.setime.resume.disabled=true;
document.setime.stopped.disabled=true;
document.getElementById('crono').style.display='none';
document.getElementById('datos').style.display='';
}else{
//alert(hora + minu + segu);
if (segu<0){
minu--;
segu=59;
if (minu<0){
hora--;
minu=59;
}
//alert(hora + minu + segu);
}
//alert(hora);
document.getElementById('cronoh').innerHTML=hora;
//alert(minu);
document.getElementById('cronom').innerHTML=minu;
//alert(segu);
document.getElementById('cronos').innerHTML=segu;
segu--;
horvar=hora;
minvar=minu;
segvar=segu;
//alert(segu);
toVar = setTimeout('cdfunc(horvar,minvar,segvar)',1000);
}
}
}
</script>
</head>
<body>
<br>
<h1>CRONÓMETRO</h1><br><br><br>
<form name="setime" method="get">
<div id="datos">
<select name="hor" onBlur="horvar=parseInt(this.value);">
<option value="00">00</option>
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="...">... Hasta 23</option>
</select>
<select name="min" onBlur="minvar=parseInt(this.value);">
<option value="00">00</option>
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="...">... Hasta 59</option>
</select>
<select name="seg" onBlur="segvar=parseInt(this.value);">
<option value="00">00</option>
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="...">... Hasta 59</option>
</select>
<button name="cdgo" onClick="document.setime.cdgo.disabled=true;
document.setime.hor.disabled=true;
document.setime.min.disabled=true;
document.setime.seg.disabled=true;
document.setime.resume.disabled=false;
document.setime.stopped.disabled=false;
document.getElementById('crono').style.display='';
document.getElementById('datos').style.display='none';
horsum=horvar;
minsum=minvar;
segsum=segvar;
cdfunc(horvar,minvar,segvar);
">GO!</button>
</div>
<br><br><br><br><br>
<div id="crono">
<p style="width:100%; text-align:center; font-size:48px;"><span id="cronoh">00</span> : <span id="cronom">00</span> : <span id="cronos">00</span></p>
<br><br>
<button name="resume" onClick="runvar=1; cdfunc(horvar,minvar,segvar); document.setime.resume.disabled=true; document.setime.stopped.disabled=false;">REANUDAR</button><button name="stopped" onClick="runvar=0; document.setime.stopped.disabled=true; document.setime.resume.disabled=false;">PAUSAR</button>
</div>
</form>
<script type='text/javascript'>
document.setime.resume.disabled=true;
document.setime.stopped.disabled=true;
document.getElementById('crono').style.display='none';
</script>
</body>
</html>
Por si alguien lo comenta, sé que tengo un juego con los able/disable de los DIVs y los campos del formulario, que en algunos momentos es inncesario, pero está hecho a voluntad. Necesito que sea así.
La versión de FireFox es la 10.0.10.
Si supiérais darme una luz, por favor...
Muchas gracias!!