javascript tiempo / jQuery cuenta atrás

Question

Quiero hacer una función, ya sea usando puro Javascript o también se benefician de jQuery para la cuenta regresiva hasta un tiempo final, tales como:

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

y debe mostrar en HTML, como

<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>

De hecho, y sería aún más grande si se puede refrescarse cada segundo.

Estoy muy ingenua con javascript y confundido acerca de cómo abordar, cualquier ayuda se aprecia.

Answer 1

Se puede usar jQuery Cuenta atrás

Answer 2

Tome un vistazo a esto: http://keith-wood.name/countdown.html

Answer 3

Se puede hacer en JavaScript sin plugins.

Es necesario para obtener la fecha y hora actuales, hasta que el denominador es uno más pequeño que lo que se está mostrando. Con su ejemplo, esto significaría que necesita para obtener todo, hasta milisegundos.

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

A continuación, encontrar la diferencia entre ahora y el momento deseado. Esto se da a usted en milisegundos.

var diff = endtime - currentTime;

Debido a que este se devuelve en milisegundos que necesita para convertirlos en segundos, minutos, horas, días, etc ... Esto significa establecer cuántos milisegundos son en cada denominador. Entonces usted es capaz de utilizar mod y se dividen para devolver el número necesario para cada unidad. Véase más abajo.

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 vez que tenga los denominadores que desea mostrar que puede volver esto a la página HTML a través de diferentes métodos. Por ejemplo:

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

Eso resume su método. Sin embargo, para hacer que se ejecute en un intervalo de tiempo establecido (por lo que se actualiza la pantalla HTML dentro de la función JavaScript) es necesario llamar a la siguiente función, dando a su nombre de la función y proporcionar su intervalo en términos de milisegundos.

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