Countdown-Timer in PHP erstellen

Subodh Poudel 30 Januar 2023
  1. Erstellen einen statischen Countdown-Timer in PHP
  2. Verwendung von TimeCircles.js zur Erstellung eine dynamischen Countdown-Timer in PHP
Countdown-Timer in PHP erstellen

In diesem Artikel stellen wir einige Methoden vor, um einen Countdown-Timer in PHP zu erstellen. Wir können einen statischen Countdown-Timer nur mit PHP erstellen. Um einen dynamischen Countdown-Timer zu erstellen, müssen wir JavaScript verwenden.

Erstellen einen statischen Countdown-Timer in PHP

Wir können mit PHP einen statischen Countdown-Timer erstellen. Der Timer wird nur aktualisiert, wenn wir die Seite aktualisieren. Andernfalls bleibt der Timer gleich. PHP läuft auf dem Server, und die Seite sollte aktualisiert werden, wenn neue Informationen vom Server benötigt werden. Der Countdown-Timer funktioniert einwandfrei, aber wir müssen die Webseite aktualisieren, wenn wir Fortschritte sehen.

Wir verwenden die PHP-Funktion time(), um die aktuelle Uhrzeit zu erhalten. Wir können die Differenz zwischen dem Zieldatum und der aktuellen Uhrzeit ermitteln und sie in Tage, Stunden, Minuten und Sekunden formatieren. Wir werden die Funktion floor() verwenden, während wir die verbleibende Zeit in die anderen Einheiten umrechnen. Die Funktion rundet das Ergebnis auf die nächste ganze Zahl ab. Als Ergebnis ist die neu berechnete Zeiteinheit genau. Die Funktion time() gibt die aktuelle Zeit in Sekunden seit dem 1. Januar 1970 00:00:00 GMT an. Wir können EpochConverter verwenden, um das aktuelle Datum und die aktuelle Uhrzeit in die Zeitstempel umzuwandeln und umgekehrt.

Wählen Sie beispielsweise ein Zieldatum aus und verwenden Sie den EpochConverter, um das Datum in Epochenzeitstempel umzuwandeln. Dann erstellen Sie eine Variable $waiting_day und weisen ihr den Zeitstempel zu. Ermitteln Sie dann die Differenz zwischen $waiting_day und der aktuellen Uhrzeit und speichern Sie das Ergebnis in einer Variablen $time_left. Berechnen Sie nun die Gesamtzahl der Tage, dividieren Sie $time_left durch die Gesamtzahl der Sekunden eines Tages, 60*60*60. Verwenden Sie beim Konvertieren die Funktion floor(). Speichern Sie das Ergebnis in der Variablen $days. Als nächstes aktualisieren Sie die Variable $time_left, um die verbleibenden Stunden in Sekunden zu ermitteln. Finden Sie dazu den Rest, indem Sie $time_left durch 60*60*60 dividieren. Verwenden Sie den Operator %, um den Rest zu finden. Suchen Sie auf ähnliche Weise die verbleibenden Stunden, Minuten und Sekunden. Um die Stunden zu finden, dividiere $time_left durch 60*60, und um die Minuten zu finden, dividiere durch 60. Die verbleibenden Zeitstempel werden in Sekunden angegeben. Drucken Sie schließlich alle Variablen aus, in denen Tage, Stunden, Minuten und Sekunden gespeichert sind.

Daher haben wir mit PHP einen statischen Countdown-Timer erstellt.

Beispielcode:

<?php
    $waiting_day = 1637210196;
    $time_left = $waiting_day - time();

    $days = floor($time_left / (60*60*24));
    $time_left %= (60 * 60 * 24);

    $hours = floor($time_left / (60 * 60));
    $time_left %= (60 * 60);

    $min = floor($time_left / 60);
    $time_left %= 60;

    $sec = $time_left;

    echo "Remaing time: $days days and $hours hours and $min min and $sec sec left";
?>

Ausgabe:

Remaing time: 17 days and 23 hours and 51 min and 26 sec left 

Verwendung von TimeCircles.js zur Erstellung eine dynamischen Countdown-Timer in PHP

Wir können einen dynamischen Countdown-Timer mit der Bibliothek TimeCircles.js in PHP erstellen. Der Countdown-Timer aktualisiert sich selbst, ohne die Webseite zu aktualisieren. TimeCircles ist ein jQuery-Plugin, mit dem Sie ganz einfach einen Countdown-Timer erstellen können. Wir können CDN verwenden, um die TimeCircles.js und jQuery in unser Skript einzubinden. Die Skript-Tags sind wie folgt.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/timecircles/1.5.3/TimeCircles.min.js" integrity="sha512-FofOhk0jW4BYQ6CFM9iJutqL2qLk6hjZ9YrS2/OnkqkD5V4HFnhTNIFSAhzP3x//AD5OzVMO8dayImv06fq0jA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

Erstellen Sie beispielsweise ein div mit einem data-date-Attribut. Schreiben Sie PHP als Wert des Attributs. Verwenden Sie die Funktion echo, um das Zieldatum 2019-02-12 07:25:14 anzuzeigen. Als nächstes setzen Sie die id des div als cd_timer. Als nächstes öffnen Sie das script-Tag und schreiben etwas jQuery. Schreiben Sie eine Funktion, wählen Sie die ID cd_timer und rufen Sie die Funktion TimeCircles() auf.

Wenn wir die Webseite von localhost aus ausführen, können wir einen Countdown-Timer sehen, der die verbleibenden Tage, Stunden, Minuten und Sekunden anzeigt. Auf diese Weise können wir mit TimeCircle.js in PHP einen dynamischen Countdown-Timer erstellen.

Beispielcode:

<div data-date="<?php echo '2019-02-12 07:25:14' ; ?>" id="cd_timer"></div>
<script>
 $(function () {
 $("#cd_timer").TimeCircles();
 });
</script>
Subodh Poudel avatar Subodh Poudel avatar

Subodh is a proactive software engineer, specialized in fintech industry and a writer who loves to express his software development learnings and set of skills through blogs and articles.

LinkedIn

Verwandter Artikel - PHP Timer