Regressive chronometer is bringing the wrong value

Asked

Viewed 78 times

3

I copied a Function from W3schools to create a regressive Chronometer. But the final date will be passed dynamically, in case the final date would be 09/06/2018

My doubt is how to pass the final date in a way that new function Data().getTime(); do the conversion correctly.

At the moment it’s returning to me like this: inserir a descrição da imagem aqui

The function that calls:

 $.get("/Home/ConsultarCicloData", null, function (data) {
                if (data != null && data != undefined) {
                    var objeto = JSON.parse(data);
                    $('#lblCiclo').text(objeto.ciclo);
                    $('#lblData').text(objeto.dataIni)
                    $('#lblDataFim').text(objeto.dataFim);

                    Cronometro(objeto.dataFim, objeto.ciclo);
                }
            });

follows code, remembering that the value of dtFinal is 09/06/2018

 function Cronometro(dtFinal, ciclo) {
            var d, m, a;
            var dtF = dtFinal.replace("/", " ").replace("/", " ");
            dtF = dtF.split(" ");
            d = dtF[0];
            m = dtF[1];
            a = dtF[2];
            var countDownDate = new Date(a,m,d).getTime();

            // Update the count down every 1 second
            var x = setInterval(function () {

                // Get todays date and time
                var now = new Date().getTime();

                // Find the distance between now an the count down date
                var distance = countDownDate - now;

                // Time calculations for days, hours, minutes and seconds
                var days = Math.floor(distance / (1000 * 60 * 60 * 24));
                var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
                var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
                var seconds = Math.floor((distance % (1000 * 60)) / 1000);

                // Output the result in an element with id="demo"

                document.getElementById("demo").innerHTML = "Faltam " + days + " Dias " + hours + " Horas "
                    + minutes + " Minutos para o fechamento da Semana " + ciclo;

                //If the count down is over, write some text 
                if (distance < 0) {
                    clearInterval(x);
                    document.getElementById("demo").innerHTML = "";
                }
            }, 1000);

        }
  • how you’re calling the function?

  • edited the question

1 answer

1


The problem of NaN in Edge and Safari browsers has been fixed in this question related.

Change the new Date() to the standard:

var countDownDate = new Date(m+" "+d+","+a).getTime();

Example:

function Cronometro(dtFinal, ciclo) {
   var d, m, a;
   var dtF = dtFinal.replace("/", " ").replace("/", " ");
   dtF = dtF.split(" ");
   d = dtF[0];
   m = dtF[1];
   a = dtF[2];
   var countDownDate = new Date(m+" "+d+","+a).getTime();

   // Update the count down every 1 second
   var x = setInterval(function () {

       // Get todays date and time
       var now = new Date().getTime();

       // Find the distance between now an the count down date
       var distance = countDownDate - now;

       // Time calculations for days, hours, minutes and seconds
       var days = Math.floor(distance / (1000 * 60 * 60 * 24));
       var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
       var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
       var seconds = Math.floor((distance % (1000 * 60)) / 1000);

       // Output the result in an element with id="demo"

       document.getElementById("demo").innerHTML = "Faltam " + days + " Dias " + hours + " Horas "
           + minutes + " Minutos para o fechamento da Semana " + ciclo;

       //If the count down is over, write some text 
       if (distance < 0) {
           clearInterval(x);
           document.getElementById("demo").innerHTML = "";
       }
   }, 1000);

}
        
Cronometro("10/06/2018", "14/2018");
<div id="demo"></div>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.