Problem with countdown

0

I'm trying to make a countdown. I thought the logic was fine, but it seems that it does not work. It consists of a countdown that, when the desired date arrives, is automatically added 1 day and the counter starts again ... but apparently it does not start again. Some help? Thank you very much in advance.

        <html> 
        <head> 
        <script type="text/javascript" language="JavaScript"> 

        var futuro = new Date (2018,9,22,20,02); //año, mes-1, dia, hora, minutos  
        var actualiza = 1000; 
        function faltan()
        { 
            var ahora = new Date(); 
            var faltan = futuro - ahora; 
            if (faltan > 0){ 
            var segundos = Math.round(faltan/1000); 
            var minutos = Math.floor(segundos/60); 
            var segundos_s = segundos%60; 
            var horas = Math.floor(minutos/60); 
            var minutos_s = minutos%60; 
            var dias = Math.floor(horas/24); 
            var horas_s = horas%24; 
            document.formulario.reloj.value= dias + " dias : " + horas_s + " horas : " + 
            +minutos_s + " minutos : " + segundos_s + " segundos" ; 
            setTimeout("faltan()",actualiza); 
        } 
        else //SI LA FECHA YA HA LLEGADO...
        { 

            var futuro = new Date();
            futuro.setHours(futuro.getHours()+24); //...LE SUMAMOS 1 DÍA (EN HORAS) A LA HORA ACTUAL Y...

            var actualiza = 1000; 
            function faltan() //...VOLVEMOS A COMENZAR LA CUENTA REGRESIVA
            { 
                var ahora = new Date(); 
                var faltan = futuro - ahora; 
                if (faltan > 0){ 
                var segundos = Math.round(faltan/1000); 
                var minutos = Math.floor(segundos/60); 
                var segundos_s = segundos%60; 
                var horas = Math.floor(minutos/60); 
                var minutos_s = minutos%60; 
                var dias = Math.floor(horas/24); 
                var horas_s = horas%24; 
                document.formulario.reloj.value= dias + " dias : " + horas_s + " horas : " + 
                +minutos_s + " minutos : " + segundos_s + " segundos" ; 
                setTimeout("faltan()",actualiza); 
            }

            document.formulario.reloj.value= "0 dias : 0 horas : 0 minutos : 0 segundos" ; 
            return true; 
        } 
        } 
        </script>
        </head> 
        <BODY onload="faltan()"> 
        <form name="formulario"> 
        <input type="text" name="reloj" value="" size="55" style="border : 0px ; text-align : center"> 
        </form> 
        </body> 
        </html>
    
asked by Matrix 23.10.2017 в 19:02
source

1 answer

1

You have a couple of errors in your code, you are declaring twice the function faltan , one within the other. Another small detail is that when you calculate the days you do it using the variable horas when you should do it with horas_s . The solution I propose is to restructure this function in the following way:

var futuro = (new Date (2017, 10, 25, 15, 48, 10)).getTime();
var actualiza = 1000;

function faltan() {
  var ahora = (new Date()).getTime();
  var faltan = futuro - ahora;

  if (faltan > 0){
    var segundos = ~~( faltan / 1000 );
    var minutos = ~~( segundos / 60 );
    var horas = ~~( minutos / 60 );
    var dias = ~~( horas / 24 );

    var segundos_s = segundos % 60;
    var minutos_s = minutos % 60;
    var horas_s = horas % 24;
    var dias_s = ~~( horas_s / 24 );

    document.formulario.reloj.value = [
	  dias_s,
	  "dias :",
	  horas_s,
	  "horas :",
	  minutos_s,
	  "minutos :",
	  segundos_s,
	  "segundos"
	].join(' ');
	
	setTimeout("faltan()",actualiza);
	
  } else {
    futuro = new Date();
    futuro.setHours(futuro.getHours()+24);
    document.formulario.reloj.value = "0 dias : 0 horas : 0 minutos : 0 segundos";
  }
}
<html>
  <head>
    <title> Timer Javascript </title>
  </head>
  <body onload="faltan()"> 
    <form name="formulario"> 
      <input type="text" name="reloj" value="" size="55" style="border : 0px ; text-align : center"> 
    </form> 
  </body> 
</html>
    
answered by 23.10.2017 / 21:59
source