在 jQuery 中處理 $.ajax 失敗

Shraddha Paghdar 2023年10月12日

jQuery jQuery AJAX

今天的文章將討論在 jQuery 中處理 AJAX 中的失敗請求。

處理 jQuery 中的 `$.ajax` 失敗

jQuery 的 AJAX 釋出請求執行非同步 HTTP (AJAX) 請求。

語法：

jQuery.ajax([settings]).fail((jqXHR, textStatus) => {});
jQuery.ajax(url[, settings]).fail((jqXHR, textStatus) => {});

其中，

URL 是包含將傳送請求的 URL 的字串。
settings 是配置 AJAX 請求的鍵/值對物件。所有設定都是可選的；可以使用 $.ajaxSetup() 為每個選項設定預設值。

.fail() 方法取代了已棄用的 .error() 方法。這是錯誤回撥選項的替代構造。

如果請求失敗，則在 AJAX 配置中呼叫 error 回撥選項。它接收 jqXHR、指示錯誤型別的字串和異常物件（如果有）。

一些內建錯誤將字串作為異常物件返回，例如：abort、timeout、no transport。

$.ajax() 返回 jQuery XMLHttpRequest (jqXHR) 物件，它是瀏覽器原生 XMLHttpRequest 物件的超集。

讓我們通過以下示例來理解它。

注意：以下程式碼不能按原樣執行，也沒有輸出。必須將其新增到現有程式碼中才能檢視輸出。

HTML 程式碼：

<form id="myForm">
  <label for="name">Name</label>
  <input id="name" name="name" type="text" value="Smith" />
  <input type="submit" value="Send" />
</form>

JavaScript 程式碼：

$('#myForm').submit(function(event) {
  event.preventDefault();
  $.ajax({
     method: 'POST',
     url: '/open/hello-world',
     data: {name: 'Smith', location: 'United State'},
     error: function(jqXHR, thrownError) {
       alert(jqXHR.status);
       alert(thrownError);
     }
   })
      .done(function(msg) {
        alert('Data Saved: ' + msg);
      })
      .fail((jqXHR, errorMsg) => {alert(jqXHR.responseText, errorMsg)});
})

在上面的示例中，一旦使用者提交了表單，就會使用指定的 URL 和引數向伺服器傳送 AJAX 呼叫。當伺服器返回成功訊息時，你可以在控制檯上列印該訊息或使用適當的訊息通知使用者。

如果伺服器返回錯誤訊息，你可以使用錯誤處理程式或 .fail() 捕獲錯誤，並使用適當的錯誤訊息通知使用者。

作者： Shraddha Paghdar

Shraddha is a JavaScript nerd that utilises it for everything from experimenting to assisting individuals and businesses with day-to-day operations and business growth. She is a writer, chef, and computer programmer. As a senior MEAN/MERN stack developer and project manager with more than 4 years of experience in this sector, she now handles multiple projects. She has been producing technical writing for at least a year and a half. She enjoys coming up with fresh, innovative ideas.

處理 jQuery 中的 $.ajax 失敗

相關文章 - jQuery AJAX

處理 jQuery 中的 `$.ajax` 失敗