AJAX（Asynchronous JavaScript and XML）是一種在網頁中使用的異步通信技術，能夠在不刷新整個頁面的情況下，與服務器進行快速的數據交換。然而，在某些情況下，我們可能需要終止發送的請求，例如用戶取消請求、發送錯誤或是不再需要服務器的響應。本文將介紹如何在使用AJAX時終止發送請求，并通過舉例進行說明。

要終止發送的AJAX請求，我們可以使用XMLHttpRequest對象提供的abort()方法。該方法會立即終止請求，并觸發onabort事件。下面是一個使用AJAX發送GET請求的示例：

var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://example.com/data', true);
xhr.send();

在上面的代碼中，我們創建了一個XMLHttpRequest實例xhr，并使用open()方法設置請求的類型、URL以及是否為異步請求。然后，通過send()方法發送該請求。如果我們希望在請求發送后進行取消操作，可以通過調用xhr.abort()方法來實現：

var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://example.com/data', true);
xhr.send();
// 取消請求
xhr.abort();

當調用xhr.abort()方法后，請求將被立即終止，并觸發onabort事件。這樣，我們就成功地取消了發送的AJAX請求。下面是一個完整的示例，展示了如何在點擊取消按鈕后，取消AJAX請求：

// HTML
<button id="cancel-btn">取消請求</button>
// JavaScript
var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://example.com/data', true);
xhr.send();
document.getElementById('cancel-btn').addEventListener('click', function() {
xhr.abort();
});

以上代碼示例中，我們在HTML中添加了一個按鈕，用于取消AJAX請求。通過addEventListener()方法，我們將點擊事件與取消請求的邏輯進行綁定。當點擊取消按鈕時，調用xhr.abort()方法即可終止發送的AJAX請求。

除了通過調用abort()方法終止發送的請求，我們還可以在發送請求之前進行檢查，如果不再需要服務器的響應，直接取消發送請求的操作。例如，當用戶輸入框內容改變時，我們希望更新搜索結果，并且只保留最新的搜索請求。在這種情況下，我們可以使用一個變量來保存最新的搜索關鍵字，并在發送請求前檢查該變量的值是否仍為最新：

// HTML
<input id="search-input">
<button id="search-btn">搜索</button>
// JavaScript
var xhr;
var searchInput = document.getElementById('search-input');
var lastSearchKeyword = '';
document.getElementById('search-btn').addEventListener('click', function() {
var keyword = searchInput.value;
// 取消之前的請求
if (xhr && xhr.readyState !== 4) {
xhr.abort();
}
// 發送新的請求
xhr = new XMLHttpRequest();
xhr.open('GET', 'https://example.com/search?keyword=' + keyword, true);
xhr.send();
lastSearchKeyword = keyword;
});
// 監聽輸入框改變事件
searchInput.addEventListener('input', function() {
var keyword = searchInput.value;
// 取消之前的請求
if (xhr && xhr.readyState !== 4) {
xhr.abort();
}
// 如果搜索關鍵字已變更，則不發送新的請求
if (keyword !== lastSearchKeyword) {
return;
}
// 發送新的請求
xhr = new XMLHttpRequest();
xhr.open('GET', 'https://example.com/search?keyword=' + keyword, true);
xhr.send();
lastSearchKeyword = keyword;
});

在上面的代碼示例中，我們在發送新的搜索請求之前，先檢查之前的請求是否已完成。如果請求尚未完成，即通過xhr.readyState屬性判斷其狀態是否為4（即已完成），則調用xhr.abort()方法終止之前的請求。這樣，我們保證了只有最新的搜索請求能夠發送到服務器。

通過以上示例，我們可以看到在使用AJAX時如何終止發送的請求。無論是通過調用abort()方法還是在發送請求前進行檢查，我們都能夠在特定情況下靈活地取消發送的AJAX請求。