javascript/hora 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, sería aún mejor si se actualiza cada segundo.

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

Answer 1

Usted podría utilizar jQuery Countdown

Answer 2

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

Answer 3

Se puede hacer en JavaScript sin plugins.

que necesita 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 significa que necesita reducir todo a milisegundos.

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

A continuación, puede encontrar la diferencia entre ahora y el tiempo deseado. Esto se te da 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. Luego puede usar mod y divide para devolver el número necesario para cada unidad. Vea 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 que se ejecute en un intervalo establecido (que es la razón por la que actualiza la pantalla HTML dentro de la función de JavaScript) necesita llamar a la siguiente función, dando su nombre de 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);