jQuery - metoda AJAX load()
Metoda jQuery load()
Metoda jQuery load()
jest prostą, ale potężną metodą AJAX.
Metoda load()
ładuje dane z serwera i umieszcza zwrócone dane w wybranym elemencie.
Składnia:
$(selector).load(URL,data,callback);
Wymagany parametr adresu URL określa adres URL, który chcesz załadować.
Opcjonalny parametr data określa zestaw par klucz/wartość ciągu zapytania do wysłania wraz z żądaniem.
Opcjonalny parametr wywołania zwrotnego to nazwa funkcji, która ma zostać wykonana po zakończeniu load()
metody.
Oto zawartość naszego przykładowego pliku: "demo_test.txt":
<h2>jQuery and AJAX is FUN!!!</h2>
<p id="p1">This is some text in a paragraph.</p>
Poniższy przykład ładuje zawartość pliku „demo_test.txt” do określonego <div>
elementu:
Przykład
$("#div1").load("demo_test.txt");
Możliwe jest również dodanie selektora jQuery do parametru URL.
Poniższy przykład ładuje zawartość elementu z id="p1" wewnątrz pliku "demo_test.txt" do określonego <div>
elementu:
Przykład
$("#div1").load("demo_test.txt #p1");
Opcjonalny parametr wywołania zwrotnego określa funkcję wywołania zwrotnego do uruchomienia po zakończeniu
load()
metody. Funkcja callback może mieć różne parametry:
responseTxt
- zawiera wynikową treść, jeśli połączenie się powiedziestatusTxt
- zawiera status połączeniaxhr
- zawiera obiekt XMLHttpRequest
Poniższy przykład wyświetla okno alertu po zakończeniu działania metody load(). Jeśli load()
metoda się powiodła, wyświetla komunikat „Zawartość zewnętrzna załadowana pomyślnie!”, a jeśli się nie powiedzie, wyświetla komunikat o błędzie:
Przykład
$("button").click(function(){
$("#div1").load("demo_test.txt", function(responseTxt, statusTxt, xhr){
if(statusTxt == "success")
alert("External content loaded successfully!");
if(statusTxt == "error")
alert("Error: " + xhr.status + ": " + xhr.statusText);
});
});
Odniesienie do jQuery AJAX
Aby uzyskać pełny przegląd wszystkich metod jQuery AJAX, przejdź do naszego jQuery AJAX Reference .