jQuery von Kopf bis Fuß (German Edition)

Zeit zu ermitteln. Genau wie die Funktionen, die Sie sie bisher erstellt haben, können Sie ihr mehrere Parameter übergeben, um verschiedene Datumsund Uhrzeitformate auszugeben. Der Hauptparameter legt fest, welches Format das Datum haben soll. Das wollen wir uns einmal genauer ansehen:

    Eine vollständige Liste aller Parameter für die
date
-Funktion finden Sie unter http://php.net/manual/en/function.date.php .
    Tun Sie das hier!
    Erstellen Sie in dem Ordner, in dem auch Ihre index.html -Datei liegt, eine neue Datei mit dem Namen zeit.php , Fügen Sie danach den folgenden Code in die Datei ein.

    Probefahrt
    Rufen Sie die Datei zeit.php nach dem Speichern im Browser auf, um zu überprüfen, ob das Datum das korrekte Format (hier in der englischen Schreibweise) hat. PHP-Code muss vom Web-server ausgeführt werden. Die URL sollte also mit http:// anstelle von file:// beginnen. Sorgen Sie außerdem dafür, dass die URL auf den Server verweist, auf dem Sie Ihren Code entwickeln.
    Noch sitzen wir nicht im Flieger. Hier eine Liste mit dem, was noch zu erledigen ist:
    Auf der Seite soll angezeigt werden, wann sie das letzte Mal aktualisiert wurde.
Es soll angezeigt werden, wie oft die Seite aktualisiert wurde.
Die Besucher sollen die Möglichkeit haben, die Aktualisierungen anzuhalten und wieder zu starten.
    Wir wollen uns zunächst mit den ersten beiden Punkten auf der Liste befassen. Da sie miteinander zu tun haben, werden wir sie gemeinsam in Angriff nehmen.
    Spitzen Sie Ihren Bleistift
    Als Nächstes brauchen wir eine neue Funktion namens
frequenz_zeigen
, mit der angezeigt werden soll, wie oft die Seite aktualisiert wurde. Fügen Sie dafür im Fußteil der Seite index.html einen zusätzlichen

-Tag ein. Zusätzlich brauchen wir noch eine Funktion, um die Datei zeit.php mithilfe der jQuery-Hilfsmethode
load
zu laden. Als Parameter erhält die Methode die URL der zu ladenden Datei. Das Ergebnis soll automatisch in das
div
-Element mit der ID
letzte_aktualisierung
geschrieben werden. Abschließend müssen wir innerhalb von
XML_lauefer_finden
den Aufruf von
aktuelle_zeit
noch gegen die neue
aktuelle_zeit_ajax
-Funktion austauschen.
    Spitzen Sie Ihren Bleistift: Lösung
    Jetzt haben Sie eine Reihe von Aktualisierungen durchgeführt: Ihre Seite index.html hat im Fußteil einen zusätzlichen

-Tag mit der ID
freq
erhalten. Die neue Funktion
aktuelle_zeit_ajax
wurde erstellt. Sie verwendet die jQuery-
load
-Methode, um die Datei zeit.php zu laden und das Ergebnis in das
div
-Element mit der ID
letzte_aktualisierung
einzufügen. Die neue Funktion ersetzt innerhalb von
XML_lauefer_finden
die JavaScript-Funktion
aktuelle_zeit.
    Probefahrt
    Fügen Sie nun den gerade erstellten Code in Ihre meine_skripte.js -Datei ein. Vergessen Sie auch nicht, das neue
span
-Element in die index.html -Seite einzubauen und den Aufruf von
aktuelle_zeit
gegen
aktuelle_zeit_ajax
auszutauschen.

    Auf der Seite soll angezeigt werden, wann sie das letzte Mal aktualisiert wurde.
Es soll angezeigt werden, wie oft die Seite aktualisiert wurde.
Die Besucher sollen die Möglichkeit haben, die Aktualisierungen anzuhalten und wieder zu starten.

    Das ist knifflig.
    Wir müssen die Funktion so ändern, dass sie nur läuft, wenn bestimmte Bedingungen zutreffen.
    Kopf-Nuss
    Welches der bisher behandelten Merkmale kann überprüfen, ob bestimmte Bedingungen zutreffen?

Zeitgesteuerte Events auf der Seite abschalten
    In den Kapitel 5 und Kapitel 7 haben wir eine »Monster«-Funktion erstellt, die
setTimeout
verwendete, um die Funktionen für die Blitzeffekte wiederholt aufzurufen. Das führte zu einigen unerwarteten Ergebnissen: Kehrte der Benutzer nach dem Öffnen eines anderen Tabs (oder einer anderen Seite) zur Monster-Applikation zurück, hatten sich dort die nicht angezeigten visuellen Effekte »aufgestaut«.
    Für unsere jetzige Aufgabe können wir aber nicht einfach die
setInterval-
Methode für die wiederholten Aufrufe einsetzen, da wir zunächst warten müssen, bis der vorige Aufruf der Funktion beendet ist.
    Hier brauchen wir eine bessere Lösung. Und welche Lösung ist besser als die bereits bekannten? Die Browser-Events
window.onblur
und
window.onfocus
browser können wir hier nicht benutzen, denn dann müssten die Leute unsere Seite erst verlassen, damit sie nicht mehr aktualisiert wird. Stattdessen wollen wir hier Bedingungslogik einsetzen, die wir bereits in verschiedenen Kapiteln gesehen haben.

    Kopf-Nuss
    Können Sie sich denken,