jQuery ajax - post() method

Manwal ng jQuery Ajax

Halimbawa

Hilingin ang web page na test.php, baguhin ang ibabaw na data na ito:

$.post("test.php");

TIY na halimbawa

Magpalit ng teksto ng div element sa pamamagitan ng AJAX POST request:

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

Subukan ang iyong sarili

Definisyon at paggamit

Ang post() method ay gumagamit ng HTTP POST request upang ilulan ang data mula sa server.

Mga pangunahing salita

jQuery.post(url,data,success(data, textStatus, jqXHR),dataType)
Parametro Paglalarawan
url Hindi opisyal. Tumutukoy sa URL kung saan ipapadala ang request.
data Opisyal. Mga mapagkukunan o string na halaga. Tumutukoy sa data na ipapadala kasama ng request sa server.
success(data, textStatus, jqXHR) Opisyal. Ang callback function na gagawin kapag nagtagumpay ang request.
dataType

Opisyal. Tumutukoy sa inaasahang MIME type ng tugon ng server.

Default na gumagawa ng intelligent na pagpili (xml, json, script o html).

Detalyadong paglalarawan

Ang function na ito ay isang maikling Ajax function, katumbas ng:

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

Ayon sa iba't ibang MIME type ng tugon, ang ibabaw na data na pinapasa sa success callback function ay iba-iba, ang mga data na ito ay maaaring maging XML root element, string na text, file na JavaScript o JSON object. Mayroon din ang pagpapasok ng text na estado ng tugon sa success callback function.

Para sa jQuery 1.5, maaari ring ipasa sa success callback function jqXHR 对象（jQuery 1.4 中传递的是 XMLHttpRequest 对象）。

Karamihan ng mga pagpapatupad ay magbabalak ng isang success function:

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

本例读取被请求的 HTML 片段，并插入页面中。

通过 POST 读取的页面不被缓存，因此 jQuery.ajaxSetup() 中的 cache 和 ifModified 选项不会影响这些请求。

注释：由于浏览器安全方面的限制，大多数 "Ajax" 请求遵守同源策略；请求无法从不同的域、子域或协议成功地取回数据。

注释：如果由 jQuery.post() 发起的请求返回错误代码，那么不会有任何提示，除非脚本已调用了全局的 .ajaxError() 方法。或者对于 jQuery 1.5，jQuery.post() 返回的 jqXHR 对象的 .error() 方法也可以用于错误处理。

jqXHR 对象

对于 jQuery 1.5，所有 jQuery 的 AJAX 方法返回的是 XMLHTTPRequest 对象的超集。由 $.post() 返回的 jQuery XHR 对象或 "jqXHR,"实现了约定的接口，赋予其所有的属性、方法，以及约定的行为。出于对由 $.ajax() 使用的回调函数名称便利性和一致性的考虑，它提供了 .error(), .success() 以及 .complete() 方法。这些方法使用请求终止时调用的函数参数，该函数接受与对应命名的 $.ajax() 回调函数相同的参数。

jQuery 1.5 中的约定接口同样允许 jQuery 的 Ajax 方法，包括 $.post()，来链接同一请求的多个 .success()、.complete() 以及 .error() 回调函数，甚至会在请求也许已经完成后分配这些回调函数。

// 请求生成后立即分配处理程序，请记住该请求针对 jqxhr 对象
    var jqxhr = $.post("example.php", function() {
      alert("success");
    })
    .success(function() { alert("second success"); })
    .error(function() { alert("error"); })
    .complete(function() { alert("complete"); });
    // Iexecute ang ibang gawain dito
    // Iset ang ibang function na complete para sa itinakdang request
    jqxhr.complete(function(){ alert("second complete"); });

Higit pang mga halimbawa

Mga Halimbawa 1

Hilingin ang pahina test.php at isumite ang ilang dagdag na datos (paano man, walang nasisigurado ang ibinabalik na nilalaman):

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

Mga Halimbawa 2

Isumite ang datos ng array sa server (paano man, walang nasisigurado ang ibinabalik na nilalaman):

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

Mga Halimbawa 3

Isumite ang datos ng porma gamit ang request na ajax:

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

Mga Halimbawa 4

Ipalabas ang resulta mula sa pahina na hiniling test.php (HTML o XML, depende sa ibinabalik na nilalaman):

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

Mga Halimbawa 5

Isumite ang datos sa pahina test.php at ipalabas ang resulta (HTML o XML, depende sa ibinabalik na nilalaman):

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

Mga Halimbawa 6

Makakuha ng nilalaman ng pahina test.php at isalba bilang objekto ng XMLHttpResponse, at iproseso sa pamamagitan ng JavaScript function na process():

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

Mga Halimbawa 7

Makakuha ng nilalaman na json na ibinabalik ng pahina test.php:

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

Manwal ng jQuery Ajax