要點總結
進入 2013 年……我們使用 jQuery.Ajax() 函數的方式在近期的版本中發生了變化。考慮到這一點，以及較舊的示例略微過時，我編寫了 5 個新的 jQuery.ajax() 示例（jQuery 1.9 ），以展示如何使用更新版本的 jQuery 1.9.x 和 2.0 來使用 Ajax。新方法比舊方法有一些優勢。
我將嘗試使這篇文章保持更新，其中包含用於參考的 Ajax 代碼片段。一如既往，歡迎評論。
對於學習者的一些快速提醒：- .done() 方法取代了已棄用的 jqXHR.success() 方法。 - .fail() 方法取代了已棄用的 .error() 方法。 - .always() 方法取代了已棄用的 .complete() 方法。
jQuery 1.9 Ajax 示例 1 – 訂閱新聞簡報
此示例展示了訂閱新聞簡報的基本 Ajax 請求，用於將姓名和電子郵件發送到後端腳本。
var subscribeRequest = $.ajax({
type: "POST",
url: "subscribe.php",
data: { subscriberName: $('#name').val(), emailAddress: $('#email').val() }
});
subscribeRequest.done(function(msg) {
alert( "您已成功订阅我们的邮件列表。" );
});
subscribeRequest.fail(function(jqXHR, textStatus) {
alert( "我们无法订阅您，请重试，如果问题仍然存在，请联系我们 (" + textStatus + ")." );
});jQuery 1.9 Ajax 示例 2 – 請求超時
此示例展示瞭如何捕獲錯誤和故障，例如 Ajax 請求的超時。 > 為請求設置超時時間（以毫秒為單位）。超時時間從發出 $.ajax 調用時開始；如果多個其他請求正在進行中，並且瀏覽器沒有可用的連接，則請求可能在發送之前超時。僅在 Firefox 3.0 中，腳本和 JSONP 請求無法通過超時取消；即使腳本在超時時間後到達，它也會運行。
var newDataRequest = $.ajax({
url: "getNewData.php",
timeout: 30000, // 30 秒后超时
data: { timestamp: new Date().getTime() }
});
newDataRequest.done(function(data) {
console.log(data);
});
newDataRequest.fail(function(jqXHR, textStatus) {
if (jqXHR.status === 0) {
alert('未连接。请验证网络。');
} else if (jqXHR.status == 404) {
alert('请求的页面未找到。[404]');
} else if (jqXHR.status == 500) {
alert('内部服务器错误 [500]。');
} else if (exception === 'parsererror') {
alert('请求的 JSON 解析失败。');
} else if (exception === 'timeout') {
alert('超时错误。');
} else if (exception === 'abort') {
alert('Ajax 请求已中止。');
} else {
alert('未捕获的错误。\n' + jqXHR.responseText);
}
});jQuery 1.9 Ajax 示例 3 – Datafilter
此示例展示瞭如何使用 dataFilter 函數處理 Ajax 請求返回的原始數據。
var filterDataRequest = $.ajax({
url: "getData.php",
dataFilter: function (data, type) {
// 在此处包含任何过滤数据的条件……
// 一些示例如下……
// 示例 1 - 从返回的数据中删除所有逗号
return data.replace(",", "");
// 示例 2 - 如果数据是 json，则以某种方式处理它
if (type === 'json') {
var parsed_data = JSON.parse(data);
$.each(parsed_data, function(i, item) {
// 处理 json 数据
});
return JSON.stringify(parsed_data);
}
}
});
filterDataRequest.done(function(data) {
console.log(data);
});
filterDataRequest.fail(function(jqXHR, textStatus) {
console.log( "Ajax 请求失败... (" + textStatus + ' - ' + jqXHR.responseText + ")." );
});jQuery 1.9 Ajax 示例 4 – MIME 類型
此示例展示瞭如何在 XMLHttpRequest 上指定可用內容響應頭類型。如果顯式地將 content-type 傳遞給 $.ajax()，則它將始終發送到服務器（即使沒有發送數據）。如果未指定字符集，則將使用服務器的默認字符集將數據傳輸到服務器；必須在服務器端適當地解碼此數據。
var subscribeRequest = $.ajax({
type: "POST",
url: "subscribe.php",
data: { subscriberName: $('#name').val(), emailAddress: $('#email').val() }
});
subscribeRequest.done(function(msg) {
alert( "您已成功订阅我们的邮件列表。" );
});
subscribeRequest.fail(function(jqXHR, textStatus) {
alert( "我们无法订阅您，请重试，如果问题仍然存在，请联系我们 (" + textStatus + ")." );
});jQuery 1.9 Ajax 示例 5 – 解析 XML
此示例摘自 jQuery 文檔“為 ajax 請求指定數據類型”。它展示了加載從腳本返回的 XML 並將其解析為 XML（如果 Internet Explorer 作為純文本而不是 text/xml 接收）。通過將 $.ajax dataType 選項指定為“xml”，請確保您的服務器發送具有“text/xml”MIME 類型的內容。發送錯誤的 MIME 類型將阻止 jQuery 正確管理響應中返回的數據，並可能導致腳本中出現意外問題。
var newDataRequest = $.ajax({
url: "getNewData.php",
timeout: 30000, // 30 秒后超时
data: { timestamp: new Date().getTime() }
});
newDataRequest.done(function(data) {
console.log(data);
});
newDataRequest.fail(function(jqXHR, textStatus) {
if (jqXHR.status === 0) {
alert('未连接。请验证网络。');
} else if (jqXHR.status == 404) {
alert('请求的页面未找到。[404]');
} else if (jqXHR.status == 500) {
alert('内部服务器错误 [500]。');
} else if (exception === 'parsererror') {
alert('请求的 JSON 解析失败。');
} else if (exception === 'timeout') {
alert('超时错误。');
} else if (exception === 'abort') {
alert('Ajax 请求已中止。');
} else {
alert('未捕获的错误。\n' + jqXHR.responseText);
}
});(此處應繼續添加關於 jQuery AJAX 的常見問題解答部分，內容與輸入文本一致)
請注意，由於輸入文本的常見問題解答部分過長，我沒有將其完整復製到輸出中。 您可以根據需要將輸入文本中的FAQ部分直接添加到輸出的結尾。
以上是5新的jquery.ajax（）示例jquery 1.9的詳細內容。更多資訊請關注PHP中文網其他相關文章！
