jQuery von Kopf bis Fuß (German Edition)

Titel: jQuery von Kopf bis Fuß (German Edition) Kostenlos Bücher Online Lesen
Autoren: Ryan Benedetti , Ronan Cranley

Vom Netzwerk:

Funktionen wieder.
    Optimierte eigene Funktionen
    Durch eigene Funktionen können Sie interaktive Webseiten programmieren, die die Leute wirklich gerne benutzen.
    Allerdings können Sich sich dabei auch leicht verzetteln. Deshalb ist es wichtig, zu überlegen, wie sich Funktionen am besten kombinieren und optimieren lassen. Dadurch sind Fehler leichter zu finden und der Code besser zu warten.

Kapitel 8. jQuery und Ajax: Gib doch mal die Daten rüber

    CSS- und DOM-Tricks mit jQuery machen schon Spaß, aber irgendwann müssen Sie Informationen (oder Daten) von einem Server abfragen und darstellen. Möglicherweise wollen Sie sogar bestimmte Teile einer Seite mit den Informationen vom Server aktualisieren, ohne dafür die ganze Seite neu laden zu müssen. Und da kommt Ajax ins Spiel. In Kombination mit jQuery und JavaScript ist auch so etwas möglich. In diesem Kapitel erfahren Sie, wie Sie mit jQuery Ajax-Abfragen an den Server schicken und was Sie mit den zurückgegebenen Antworten anfangen können.

Bringen Sie das Bit-to-Byte-Rennen ins neue Jahrhundert!
    Von: Webville MegaCorps Marketing
    Betreff: Ergebnisseite für das 42. Bit-to-Byte-Rennen
    Liebes Webdesign-Team,
    wie Sie wissen, sponsern wir jedes Jahr das Bit-to-Byte-10.000-Meter-Rennen, indem wir die Ergebnisseite zur Verfügung stellen. Allerdings ist unsere Seite schon längst nicht mehr zeitgemäß. Sie wird erst aktualisiert, wenn alle Ergebnisse vorliegen. Die Besucher wollen die Ergebnisse aber am liebsten in Echtzeit sehen. Mit Twitter und Facebook können Leute, die persönlich beim Rennen anwesend sind, schneller Informationen liefern als wir.
    Wir haben eine Aufgabe für Sie, die sich lohnen kann. Wenn Sie es schaffen, die Webville-Ergebnisseite bis nächste Woche auf den neuesten Stand zu bringen, bekommen Sie am Ende des Rennens freien Eintritt zum VIP-Bereich. (Das Rennen ist dieses Jahr übrigens in Maui auf Hawaii.)
    Hier eine Liste der Dinge, die wir brauchen:
    Die Besucher sollen entscheiden können, ob nur männliche, nur weibliche oder alle Teilnehmer angezeigt werden.
Die Seite soll automatisch aktualisiert werden, sobald ein Läufer die Ziellinie überquert.
Es soll nicht nötig sein, die Seite neu zu laden, um die aktualisierten Ergebnisse zu sehen.
Abschließend soll angezeigt werden, wann die Seite das letzte Mal aktualisiert wurde und wie oft. Außerdem sollen die Besucher die Möglichkeit haben, die Aktualisierungen in ihrem Browser selbst zu starten und zu stoppen. Das Design unterscheidet sich nicht großartig von dem im letzten Jahr. Sie haben also einen guten Ausgangspunkt. Für uns ist das Rennen eine wichtige Veranstaltung. Wir sind gespannt auf Ihre Ideen!
    --
    Dionah C. Housney
    Marketingchefin
    Webville MegaCorp

Ein Blick auf die Seite des letzten Jahres
    Zum besseren Verständnis der Anforderungen der Marketingabteilung wollen wir einen Blick auf die Ergebnisseite vom letzten Jahr werfen. Am meisten interessieren uns im Moment das Aussehen und der Aufbau der Seite.

Plugins konfigurieren
    Plugins sind Erweiterungen der jQuery-Basisbibliothek, mit denen die Funktionalität erweitert oder bestimmte Aufgaben erleichtert werden können. Im obigen Beispiel wandelt das
idTabs
-Plugin ein
ul
-Element in anklickbare Tabs um und sagt dem Browser, welche
div
-Elemente angezeigt werden sollen, wenn ein
a
-Link innerhalb der Listenelemente angeklickt wird. Dieses Plugin erzeugt eine leicht zu benutzende Navigationsstruktur für unsere Seite. Dadurch können wir verschiedene Informationsarten visuell voneinander trennen und trotzdem an der gleichen Stelle auf dem Bildschirm darstellen.
    Entspannen Sie sich
    Machen Sie sich nicht zu viele Gedanken um das Plugin.
    Plugins erweitern die Standard-jQuery-Bibliothek um zusätzlichen Funktionen. In Kapitel 10 werden wir detaillierter auf Plugins eingehen. Im Augenblick wollen wir sehen, wie dieses Plugin unsere Projektentwicklung beschleunigen kann.
    Code-Fertiggericht
    Bevor wir weitermachen, wollen wir zunächst einen Blick auf die Dateien des letzten Jahres werfen, um uns mit der Grundstruktur vertraut zu machen. Den Code finden Sie in der Datei last_year.zip . Sie können ihn (zusammen mit den anderen Beispieldateien für dieses Kapitel) unter http://thinkjquery.com/chapter08 herunterladen. Hier sehen Sie Ausschnitte aus den drei benötigten Dateien meine_stile.css , index.html und meine_skripte.js . Den eingedeutschten Code finden Sie unter www.oreilly.de/catalog/hfjqueryger .

Jetzt