conta javascript tempo / jquery giù

Question

Voglio fare una funzione sia utilizzando pura Javascript o anche beneficiando jquery il conto alla rovescia per un tempo di fine come ad esempio:

//consumes a javascript date object
function countDown(endtimme){
...
}

e dovrebbe visualizzare in HTML come

<div id="time_left_box">
    <h1>Time remaining</h1>:

    <p>hours left: ..remaining day will be here## <p>
    <p>minutes left: ##remaining day will be here## <p>
    <p>seconds left: ##remaining day will be here## <p>
</div>

In effetti e sarebbe ancora più grande se si può aggiornare se stesso ogni secondo.

Sono molto ingenuo con javascript e confuso su come affrontare, qualsiasi aiuto sarebbe apprezzato.

Answer 1

Si potrebbe utilizzare jQuery Countdown

Answer 2

Date un'occhiata a questo: http://keith-wood.name/countdown.html

Answer 3

Si può fare in JavaScript senza plugin.

È necessario per ottenere l'ora data corrente, verso il basso per il denominatore che è uno più piccolo di quello che si sta visualizzando. Con il vostro esempio, questo vorrebbe dire è necessario per ottenere tutto ciò che fino a millisecondi.

var currentTime = new Date(n.getFullYear(), n.getMonth(), n.getDate(), n.getHours(), n.getMinutes(), n.getSeconds(), n.getMilliseconds());

È quindi trovare la differenza tra ora e il tempo desiderato. Questo è dato a voi in millisecondi.

var diff = endtime - currentTime;

Poiché questo viene restituito in millisecondi è necessario convertirli in secondi, minuti, ore, giorni, ecc ... Questo significa stabilire quanti millisecondi sono in ogni denominatore. Poi si è in grado di utilizzare mod e dividere per restituire il numero necessario per ogni unità. Vedi sotto.

var miliseconds = 1;
var seconds = miliseconds * 1000;
var minutes = seconds * 60;
var hours = minutes * 60;
var days = hours * 24;
var years = days * 365;

//Getting the date time in terms of units
//Floored so that they go together (to get just year/days/hours etc.. by themselves you need to use Math.round(diff/desired unit);
var numYears = Math.floor(diff / years);
var numDays = Math.floor((diff % years) / days);
var numHours = Math.floor((diff % days) / hours);
var numMinutes = Math.floor((diff % hours) / minutes);
var numSeconds = Math.round((diff % minutes) / seconds);

Una volta che hai i denominatori che si desidera visualizzare è possibile restituire questo alla pagina html attraverso diversi metodi. Ad esempio:

document.getElementById("tyears").innerHTML = numYears;

Che riassume il metodo. Tuttavia, per farlo girare su un determinato intervallo (che è il motivo per cui si aggiorna la visualizzazione HTML all'interno della funzione JavaScript) è necessario chiamare la funzione seguente, dando il vostro nome della funzione e fornire il proprio intervallo in termini di millisecondi.

//Call the count down timer function every second (measured in miliseconds)
setInterval(countDown(endtime), 1000);