Mischen Sie Ajax in HTML mit Intercooler.js ein
Es war noch nie einfacher Fügen Sie Ajax zu jeder Website hinzu. Tatsächlich ist es ziemlich üblich, ganze Websites zu erstellen basiert auf Ajax-Anfragen namens Einseitige Apps (oder SPAs).
Dies hat jedoch immer ein wenig jQuery und ein gewisses technisches Ringen erforderlich gemacht Seiteninhalt aktualisieren. Wenn Sie nur etwas brauchen grundlegende Ajax-Funktionalität Sie können verwenden intercooler.js um es direkt in Ihren HTML-Code zu mischen.
Intercooler lässt Sie HTML-Attribute schreiben enthalten nativ Ajax-Anforderungs-URLs. Wenn Benutzer auf bestimmte Links klicken, können Sie dies vorgeben Ajax-Anforderungen werden ausgeführt anstelle der normalen Klickaktion.
Das alles stützt sich auf HTML5-Daten- * Attribute sowie ic-post-to. Sie können dieses Attribut zu einer Schaltfläche oder einem Anker-Link hinzufügen Verbinden Sie sich automatisch mit jQuery für eine Ajax-POST-Anfrage.
Es gibt tatsächlich eine Seite voll von diesen Attributen auf der Plugin-Website. Hier ist ein bisschen von Beispielcode um zu sehen wie es aussieht:
Klick mich!
Das würde Senden Sie eine Ajax-POST-Anforderung an die URL / buton_click, und lade die Antwort in das Behälterelement. Intercooler ist eine ziemlich einfache Bibliothek und unglaublich mächtig, wenn Sie wissen, wie es funktioniert.
Zugegeben, dadurch werden nicht alle Ihre Ajax-Probleme gelöst Andere Bereiche der Seite können nicht automatisch aktualisiert werden. Es auch Es können nicht zu viele benutzerdefinierte Funktionen hinzugefügt werden ohne die Seite zu verlangsamen, so eine detaillierte SPA sollte wirklich Verwenden Sie benutzerdefinierten Ajax-Code.
Intercooler.js bietet a mehr semantische Weise zum Schreiben von Ajax-Code so dass es lädt und sogar einen nativen Fallback bietet.
Zu Ladeluftkühler installieren Du brauchst nur einen Kopie von jQuery zusammen mit einem Kopie der Intercooler-Bibliothek welches auf GitHub zu finden ist. Du kannst sogar testen ohne herunterladen beliebige Dateien mit einem jQuery-CDN und dem lokalen Intercooler-CDN.
Beide in eine >
Werfen Sie einen Blick auf die Demoseite a sehen vollständige Liste der Demos du kannst mit spielen Die Demo "Click to Edit" gefällt mir besonders gut, da sie genau zeigt, was möglich ist und wie weit Sie dieses Plugin verwenden können.
Wenn Sie interessiert sind mehr lernen Besuche die Referenzhandbuch voller intercooler HTML-Attribute. Jeder führt eine andere Aktion aus Daher ist es wichtig, sie alle zu studieren und zu sehen, was passt am besten für dein Szenario.
Natürlich kannst du finden der gesamte Quellcode kostenlos auf GitHub zusammen mit einem kurze Installationsanleitung.
