Metoda post() jQuery ajax

Przykład

Żądanie strony test.php, zignorowanie wartości zwrotnej:

$.post("test.php");

Przykład

Zmiana tekstu elementu div za pomocą żądania AJAX POST:

$("input").keyup(function(){
  txt=$("input").val();
  $.post("demo_ajax_gethint.asp",{suggest:txt},function(result){
    $("span").html(result);
  });
});

Spróbuj sam

Definicja i użycie

Metoda post() ładuje dane z serwera za pomocą żądania HTTP POST.

Gramatyka

jQuery.post(url,data,success(data, textStatus, jqXHR),dataType)
Parametry Opis
url Wymagane. Określa, do której URL wysyłane jest żądanie.
data Opcjonalnie. Mapowanie lub wartość ciągła. Określa dane wysyłane razem z żądaniem do serwera.
success(data, textStatus, jqXHR) Opcjonalnie. Funkcja zwrotna wykonywana po udanym żądaniu.
dataType

Opcjonalnie. Określa oczekiwany typ danych odpowiedzi serwera.

Domyślnie wykonuje inteligentne rozpoznawanie (xml, json, script lub html).

Szczegółowe wyjaśnienie

Ta funkcja jest skróconą wersją funkcji Ajax, równoważną:

$.ajax({
  type: 'POST',
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

W zależności od różnego rodzaju MIME typów odpowiedzi, dane przekazywane do funkcji zwrotnej success różnią się, mogą to być element XML, ciąg znaków, plik JavaScript lub obiekt JSON. Można również przekazać do funkcji zwrotnej success tekstowy stan odpowiedzi.

Dla jQuery 1.5, można również przekazać do funkcji zwrotnej success: obiektami jqXHR(jQuery 1.4 przesyła obiekt XMLHttpRequest)。

Większość implementacji określa funkcję success:

$.post("ajax/test.html", function(data) {
  $(".result").html(data);
});

w tym przykładzie czytany jest fragment HTML i wstawiany do strony.

Strony odczytywane przez POST nie są w pamięci podręcznej, więc jQuery.ajaxSetup() opcje cache i ifModified nie wpływają na te żądania.

Komentarz:Z powodu ograniczeń bezpieczeństwa przeglądarki, większość żądań "Ajax" przestrzega strategii samego źródła; żądania nie mogą pomyślnie uzyskać danych z różnych domen, poddomen lub protokołów.

Komentarz:Jeśli żądanie uruchomione przez jQuery.post() zwróci kod błędu, nie będzie żadnych powiadomień, chyba że skrypt wywołał globalną .ajaxError() metoda. lub metoda .error() obiektu jqXHR zwracanego przez jQuery.post() może również być używana do obsługi błędów.

obiektami jqXHR

Dla jQuery 1.5, wszystkie metody Ajax jQuery zwracają superset obiektu XMLHTTPRequest. Obiekt jQuery XHR zwracany przez $.post() lub "jqXHR," realizuje umówione interfejsy, dając mu wszystkie atrybuty, metody oraz umówione zachowania. W związku z $.ajax() Dla ułatwienia i spójności nazw funkcji zwrotnych, dostarcza .error(), .success() oraz .complete() metody. Te metody używają funkcji wywoływanych przy zakończeniu żądania, które przyjmują te same parametry co odpowiednie funkcje zwrotne $.ajax().

Interfejsy umówione w jQuery 1.5 pozwalają również na łączenie wielu funkcji zwrotnych .success(), .complete() oraz .error() dla jednego żądania Ajax, nawet jeśli żądanie może być już zakończone, a te funkcje zwrotne są przypisane.

// Proszę pamiętać, że zaraz po utworzeniu żądania przypisujemy handler, który dotyczy obiektu jqxhr
    var jqxhr = $.post("example.php", function() {
      alert("success");
    }
    .success(function() { alert("second success"); })
    .error(function() { alert("error"); })
    .complete(function() { alert("complete"); });
    // Wykonaj inne zadania tutaj
    // Ustaw drugą funkcję zakończenia dla powyższego żądania
    jqxhr.complete(function(){ alert("second complete"); });

Więcej przykładów

Przykład 1

Żądaj strony test.php i wysyłaj dodatkowe dane (pomimo tego, że nadal ignorujemy zwróconą wartość):

$.post("test.php", { name: "Bill", time: "2pm" } );

Przykład 2

Przekazuj dane do serwera w formie tablicy (pomimo tego, że nadal ignorujemy zwróconą wartość):

$.post("test.php", { 'choices[]': ["Jon", "Susan"] });

Przykład 3

Wysyłaj dane formularza za pomocą żądania AJAX:

$.post("test.php", $("#testform").serialize());

Przykład 4

Wyświetl wynik zwrócony przez stronę żądania test.php (HTML lub XML, w zależności od zwróconej zawartości):

$.post("test.php", function(data){
   alert("Data Loaded: " + data);
 });

Przykład 5

Wysyłaj dane do strony test.php i wyświetl wynik (HTML lub XML, w zależności od zwróconej zawartości):

$.post("test.php", { name: "Bill", time: "2pm" },
   function(data){
     alert("Data Loaded: " + data);
   });

Przykład 6

Otrzymaj zawartość strony test.php i zapisz ją jako obiekt XMLHttpResponse, a następnie przetwarzaj ją za pomocą funkcji JavaScript process():

$.post("test.php", { name: "Bill", time: "2pm" },
   function(data){
     process(data);
   }, "xml");

Przykład 7

Otrzymaj zawartość w formacie json zwróconą przez stronę test.php:

$.post("test.php", { "func": "getNameAndTime" },
   function(data){
     alert(data.name); // Bill
     console.log(data.time); //  2pm
   }, "json");