javascript/czas jQuery odliczanie

Question

Chcę utworzyć funkcję albo za pomocą czystej JavaScript lub też korzystają z jQuery odliczanie do czasu kończący takie jak:

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

i powinien on wykazywać w html, takich jak

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

Rzeczywiście byłoby jeszcze lepiej, gdyby odświeżał się w każdej sekundzie.

Jestem bardzo naiwny z javascript i zdezorientowany, jak podejść, każda pomoc byłaby docenić.

Answer 1

Można użyć jQuery Countdown

Answer 2

Spójrz na ten jeden: http://keith-wood.name/countdown.html

Answer 3

Można to zrobić w JavaScript bez wtyczek.

Musisz uzyskać aktualny czas daty, aż do mianownika, który jest jeden mniejszy niż wyświetlany. Na twoim przykładzie oznaczałoby to, że musisz sprowadzić wszystko do milisekund.

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

Następnie można znaleźć różnicę między teraz a żądanym czasem. Otrzymujesz to w milisekundach.

var diff = endtime - currentTime; 

Ponieważ ta jest zwracana w milisekundach trzeba przekonwertować je na sekundy, minuty, godziny, dni itd ... Oznacza to ustanowienie ile milisekund są w każdym mianownika. Następnie możesz użyć modowania i dzielenia, aby zwrócić liczbę potrzebną do każdej jednostki. Zobacz poniżej.

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

Gdy masz mianownik, który chcesz wyświetlić, możesz go zwrócić na stronę html różnymi metodami. Na przykład:

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

To podsumowuje twoją metodę. Jednak, aby uruchomić go w ustawionym interwale (dlatego aktualizujesz wyświetlacz HTML w ramach funkcji JavaScript), musisz wywołać następującą funkcję, podając nazwę funkcji i podać interwał w milisekundach.

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