jQuery中ajax - post() 方法實(shí)例詳解

在jquery中的ajax有二個(gè)數(shù)據(jù)發(fā)送模式，一種是get，另一種是post()。

jQuery Ajax 參考手冊(cè)

實(shí)例

請(qǐng)求 test.php 網(wǎng)頁(yè)，忽略返回值：

$.post("test.php");

TIY 實(shí)例

通過(guò) AJAX POST 請(qǐng)求改變 div 元素的文本：

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

親自試一試

定義和用法

post() 方法通過(guò) HTTP POST 請(qǐng)求從服務(wù)器載入數(shù)據(jù)。

語(yǔ)法

jQuery.post(url,data,success(data, textStatus, jqXHR),dataType)

詳細(xì)說(shuō)明

該函數(shù)是簡(jiǎn)寫(xiě)的 Ajax 函數(shù)，等價(jià)于：

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

根據(jù)響應(yīng)的不同的 MIME 類(lèi)型，傳遞給 success 回調(diào)函數(shù)的返回?cái)?shù)據(jù)也有所不同，這些數(shù)據(jù)可以是 XML 根元素、文本字符串、JavaScript 文件或者 JSON 對(duì)象。也可向 success 回調(diào)函數(shù)傳遞響應(yīng)的文本狀態(tài)。

對(duì)于 jQuery 1.5，也可以向 success 回調(diào)函數(shù)傳遞 jqXHR 對(duì)象（jQuery 1.4 中傳遞的是 XMLHttpRequest 對(duì)象）。

大部分實(shí)現(xiàn)會(huì)規(guī)定一個(gè) success 函數(shù)：

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

本例讀取被請(qǐng)求的 HTML 片段，并插入頁(yè)面中。

通過(guò) POST 讀取的頁(yè)面不被緩存，因此 jQuery.ajaxSetup() 中的 cache 和 ifModified 選項(xiàng)不會(huì)影響這些請(qǐng)求。

注釋?zhuān)河捎跒g覽器安全方面的限制，大多數(shù) "Ajax" 請(qǐng)求遵守同源策略；請(qǐng)求無(wú)法從不同的域、子域或協(xié)議成功地取回?cái)?shù)據(jù)。

注釋?zhuān)喝绻?jQuery.post() 發(fā)起的請(qǐng)求返回錯(cuò)誤代碼，那么不會(huì)有任何提示，除非腳本已調(diào)用了全局的 .ajaxError() 方法?；蛘邔?duì)于 jQuery 1.5，jQuery.post() 返回的 jqXHR 對(duì)象的 .error() 方法也可以用于錯(cuò)誤處理。

jqXHR 對(duì)象

對(duì)于 jQuery 1.5，所有 jQuery 的 AJAX 方法返回的是 XMLHTTPRequest 對(duì)象的超集。由 $.post() 返回的 jQuery XHR 對(duì)象或 "jqXHR,"實(shí)現(xiàn)了約定的接口，賦予其所有的屬性、方法，以及約定的行為。出于對(duì)由 $.ajax() 使用的回調(diào)函數(shù)名稱(chēng)便利性和一致性的考慮，它提供了 .error(), .success() 以及 .complete() 方法。這些方法使用請(qǐng)求終止時(shí)調(diào)用的函數(shù)參數(shù)，該函數(shù)接受與對(duì)應(yīng)命名的 $.ajax() 回調(diào)函數(shù)相同的參數(shù)。

jQuery 1.5 中的約定接口同樣允許 jQuery 的 Ajax 方法，包括 $.post()，來(lái)鏈接同一請(qǐng)求的多個(gè) .success()、.complete() 以及 .error() 回調(diào)函數(shù)，甚至?xí)谡?qǐng)求也許已經(jīng)完成后分配這些回調(diào)函數(shù)。

// 請(qǐng)求生成后立即分配處理程序，請(qǐng)記住該請(qǐng)求針對(duì) jqxhr 對(duì)象
 var jqxhr = $.post("example.php", function() {
 alert("success");
 })
 .success(function() { alert("second success"); })
 .error(function() { alert("error"); })
 .complete(function() { alert("complete"); });
 // 在這里執(zhí)行其他任務(wù)
 
 // 為上面的請(qǐng)求設(shè)置另一個(gè)完成函數(shù)
 jqxhr.complete(function(){ alert("second complete"); });

更多實(shí)例

例子 1

請(qǐng)求 test.php 頁(yè)面，并一起發(fā)送一些額外的數(shù)據(jù)（同時(shí)仍然忽略返回值）：

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

例子 2

向服務(wù)器傳遞數(shù)據(jù)數(shù)組（同時(shí)仍然忽略返回值）：

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

例子 3

使用 ajax 請(qǐng)求發(fā)送表單數(shù)據(jù)：

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

例子 4

輸出來(lái)自請(qǐng)求頁(yè)面 test.php 的結(jié)果（HTML 或 XML，取決于所返回的內(nèi)容）：

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

例子 5

向頁(yè)面 test.php 發(fā)送數(shù)據(jù)，并輸出結(jié)果（HTML 或 XML，取決于所返回的內(nèi)容）：

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

例子 6

獲得 test.php 頁(yè)面的內(nèi)容，并存儲(chǔ)為 XMLHttpResponse 對(duì)象，并通過(guò) process() 這個(gè) JavaScript 函數(shù)進(jìn)行處理：

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

例子 7

獲得 test.php 頁(yè)面返回的 json 格式的內(nèi)容：

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

以上內(nèi)容通過(guò)實(shí)例給大家介紹了jQuery中ajax - post() 方法示例詳解，希望對(duì)大家今后的工作學(xué)習(xí)有所幫助，在下篇文章將給大家介紹jquery中ajax-get（）方法示例詳解，需要的朋友請(qǐng)持續(xù)關(guān)注本站。

聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com