Javascript / jquery Zeit herunter

Question

Ich mag eine Funktion machen entweder rein mit Javascript oder auch von jquery profitieren zu einer Endzeit rückwärts zu zählen, wie:

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

, und es sollte in HTML wie

Anzeigen

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

Tatsächlich, und es wäre noch toll, wenn es sich in jeder Sekunde auffrischen kann.

Ich bin sehr naiv mit Javascript und verwirrt darüber, wie zu nähern, jede Hilfe wäre zu schätzen wissen.

Answer 1

könnten Sie jQuery Countdown

Answer 2

Schauen Sie sich auf diese: http://keith-wood.name/countdown.html

Answer 3

Es kann in JavaScript ohne Plugins erfolgen.

Sie müssen das aktuelle Datum Zeit bekommen, bis auf den Nenner, ein kleiner als das, was Sie anzeigen. Mit Ihrem Beispiel würde dies bedeuten, Sie alles bis auf Millisekunden erhalten müssen.

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

Sie finden dann den Unterschied zwischen jetzt und dem gewünschten Zeitpunkt. Dies wird in Millisekunden Ihnen gegeben.

var diff = endtime - currentTime;

Da dies in Millisekunden zurückgegeben müssen Sie sie in Sekunden, Minuten, Stunden, Tage konvertieren etc ... Das bedeutet, festzustellen, wie viele Millisekunden in jedem Nenner sind. Dann sind Sie in der Lage mod zu verwenden und teilen Sie die Nummer für jede Einheit benötigt, um zurückzukehren. Siehe unten.

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

Sobald Sie die Nennern Sie anzeigen möchten, können Sie dies auf der HTML-Seite durch verschiedene Methoden zurück. Zum Beispiel:

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

Das fasst Ihre Methode auf. Allerdings, um es auf einem festgelegten Intervall laufen zu lassen (das ist, warum Sie die HTML-Anzeige in der JavaScript-Funktion aktualisieren) Sie die folgende Funktion aufrufen müssen, Ihre Funktion Namen zu geben und geben Sie Ihre Intervall in Millisekunden.

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