W tym poście zadaliśmy sobie trud przygotowania praktycznego przewodnika po zrozumieć AJAX w JQUERY z łatwymi i prostymi metodami. AJAX to skrót od Asynchronous JavaScript i XML Dowiedz się, jak krok po kroku używać i konfigurować Google Maps JavaScript API
Jest to nowy zestaw technik, który obejmuje kilka starych technologii, takich jak: JavaScript, XML, dokument, model obiektowy (DOM). Wśród tych technologii jedynym nowym elementem jest XMLHttpRequest.
JQUERY to biblioteka należąca do języka programowania javascriptJest to jeden z najczęściej używanych w tworzeniu stron internetowych, open source, z możliwością poprawy interaktywności strony internetowej i jej szybkości.
Wielu programistów zdecydowało się na projektowanie aplikacji internetowych przypominających desktopy JQUERY do implementacji zachowań AJAX. W JQUERY istnieje różnorodność funkcji do tworzenia AJAX. Poniżej znajdują się dostępne metody dla łatwo zrozumieć AJAX w JQUERY.
Metody AJAX JQUERY
.Załaduj()
Pozwala to załadować dane do elementu strony, podając adres URL pliku, z którego chcesz go pobrać AJAX. Ta metoda aktualizuje kod HTML elementu, na którym wywoływana jest funkcja .load(). Nie pozwala na więcej parametrów i nie wykonuje więcej akcji niż te wymienione.
$(„#item”).load(„page.html”);
Jeśli chcesz przesłać dane przez DOSTAWAĆ do strony, możesz użyć .load() wskazując te dane „odręcznie” w adresie URL pliku, do którego uzyskujesz dostęp, chociaż istnieją inne lepsze metody na zrobienie tego.
$(„#element”).load(„page.php?data=222”);
Metoda load() zajmuje się wszystkim, wysyłając żądanie do serwera i wysyłając HTML odpowiedzi do kontenera, w którym wywoływana jest funkcja .load().
$.get() i $.post()
Są to dwie siostrzane metody, które robią prawie to samo: połączenie AJAX wysyłanie danych na serwer. Różnica polega na tym, że $.get() wysyła dane przez DOSTAWAĆ (w adresie URL) i $.post() wysyła je przez POCZTA (w nagłówkach HTTP). W przypadku tych metod wysyła zestaw parametrów o większej złożoności, jednak tylko pierwszy z nich jest obowiązkowy.
$.get(„url.php”, {
wartość danych”,
dane2: „wartość2”
}, funkcja(odpowiedź){
$( „#wynik” ).html( dane );
}, „html”);
To nazwałoby adresy URL „url.php” przechodzący przez metodę DOSTAWAĆ dane i wartości wskazane w drugim parametrze. Po otrzymaniu odpowiedzi wykona funkcję wskazaną w trzecim parametrze, a dane, które oczekuje od serwera jako odpowiedź, mają format wskazany w czwartym parametrze. Należy zauważyć, że istnieją różne formaty odpowiedzi: JSON, skrypt, HTML lub XML.
$.post() jest dokładnie identyczna, dane zostaną wysłane przez jQuery metodą POCZTAw ten sposób wszystko, czego możesz się nauczyć o $.get(), można zastosować do $.post().
Aspekty, które należy wziąć pod uwagę
Powinieneś wziąć pod uwagę, że .load() jest wywoływana na obiekcie jQuery, który przedstawia jeden lub kilka elementów strony, w której chcesz załadować treść, którą on wnosi AJAX. Aby wykonać metodę taką jak $.post() lub $.get(), musisz to zrobić z funkcji $ lub jQuerybiorąc pod uwagę, że to wywołanie nie jest powiązane z elementem strony.
W funkcji, która jest wykonywana po wystąpieniu wyniku żądania AJAX musisz wybrać element lub elementy, w których chcesz wyświetlić wyniki.
Te metody mają inne zastosowanie, ponieważ zwracają obiekt AJAX, którego możesz użyć do wykonania innych akcji, które pozwolą Ci skonfigurować żądanie. Przykładem tego jest sytuacja, w której możesz zdefiniować takie rzeczy, jak co zrobić, gdy żądanie zostanie uruchomione, jeśli wystąpi błąd.
var AJAXObject = $.get( „Whatever.php”, function() {
//zrób coś, gdy pojawi się odpowiedź AJAX
});
AJAXObject.done(funkcja() {
//zrób coś innego, gdy pojawi się poprawna odpowiedź z żądania
})
AJAXObject.fail(funkcja() {
//zrób coś, gdy wystąpi błąd
})
AJAXObject.always(funkcja() {
//zrób coś zarówno w przypadku błędu, jak i sukcesu
});
$.getScript()
To kolejna metoda „stenografia”jest to skrót do ładowania scenariusz JavaScript i wprowadzić go do realizacji w momencie, w którym został prawidłowo odebrany. Możesz skonfigurować wysyłanie danych, a ta metoda zrobi to za DOSTAWAĆ, tak jak zostały wysłane w $.get().
$.getJSON()
Czy inny? „metoda skrótowa” bardzo używane. Uzyskaj odpowiedź na JSON. Jest dokładnie tak samo, jak opisano w „getScript()”, tylko w odpowiedzi otrzyma obiekt JavaScript.
W odpowiedzi serwer musi wysłać zawartość obiektu w formacie JSON, który jQuery wewnętrznie zajmie się interpretacją i przekształceniem w natywny obiekt JavaScript, do którego można uzyskać dostęp w celu pobrania dowolnych jego danych.
W dokumentacji JQuery znajduje się inna klasyfikacja metod
nosi nazwę „Globalne programy obsługi zdarzeń AJAX”to globalne zdarzenia, które możesz przypisać do dowolnego żądania AJAX rozwiń na jednej stronie. Są zdefiniowane raz i wpływają na wszystkie połączenias AJAX Co mogę zrobić na tej stronie?
W ten sposób możesz zapisać konfigurację różnych typowych zachowań, takich jak komunikaty „ładowanie…”, każdej z funkcji AJAX
Istnieją zdarzenia określające czasy generowania żądania, wystąpienia błędu, powodzenia odpowiedzi i tak dalej. Czyje wydarzenia dodają je do obiektu jQuery rozszerzonego dokumentu. Dowiedz się, jak wykonać kliknięcie lub zdarzenie w Jquery.
$( dokument ).AJAXError(funkcja() {
alert(„żądanie AJAX nie powiodło się (nie pytaj mnie które)”);
});
To wszystko, dzięki tym informacjom, które dostarczyliśmy, będziesz mógł łatwo zrozumieć AJAX w JQUERY i za kilka minut.