AJAX（Asynchronous JavaScript and XML）是一種用于創建快速和動態網頁的前端技術。通過使用AJAX，網頁可以在后臺發送和接收數據，而無需刷新整個頁面。在傳統的網頁開發中，當用戶提交表單時，頁面會直接刷新并加載新的頁面。然而，使用AJAX，我們可以在用戶提交表單后，將新的數據作為響應返回，并將其插入到頁面中的特定位置，而無需刷新整個頁面。本文將討論如何使用AJAX在頁面中實現值返回和頁面跳轉的效果。

在很多情況下，用戶在填寫表單提交后，我們可能需要返回相應的數據給用戶，并且還需要跳轉到另一個頁面。一種常見的例子是，在網上購物時，用戶提交訂單后，我們希望向用戶確認訂單信息，并跳轉到支付頁面。使用AJAX，我們可以在不刷新整個頁面的情況下實現上述效果。

讓我們來看一個簡單的示例，假設我們有一個網頁，用戶可以填寫姓名、地址和電話號碼。當用戶點擊提交按鈕時，我們會將用戶輸入的數據發送到服務器進行處理，并將處理后的訂單號作為響應返回。在此期間，我們希望頁面能夠顯示“訂單處理中”的信息，并在返回訂單號后自動跳轉到支付頁面。

function submitForm() {
// 獲取用戶輸入數據
var name = document.getElementById('name').value;
var address = document.getElementById('address').value;
var phone = document.getElementById('phone').value;
// 向服務器發送數據并處理響應
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
var orderNumber = xmlhttp.responseText;
// 在頁面中顯示訂單號
var resultDiv = document.getElementById('result');
resultDiv.innerHTML = "您的訂單號是：" + orderNumber;
// 跳轉到支付頁面
window.location.href = "payment.html";
}
};
// 構造請求
var url = "processOrder.php";
var params = "name=" + name + "&address=" + address + "&phone=" + phone;
// 發送請求
xmlhttp.open("POST", url, true);
xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xmlhttp.send(params);
}

在上述示例中，我們定義了一個名為submitForm()的函數，該函數會在用戶點擊提交按鈕時被調用。首先，我們獲取用戶輸入的姓名、地址和電話號碼，并將它們作為數據發送到服務器。然后，我們創建了XMLHttpRequest對象，以便進行異步請求。當服務器響應返回時，我們檢查響應的狀態碼和就緒狀態，確保響應成功返回并完全接收。然后，我們提取訂單號，并將其插入到頁面中的特定位置。最后，我們使用JavaScript中的window.location.href屬性將頁面跳轉到支付頁面。

通過使用上述代碼，我們可以實現當用戶提交表單時，在頁面中顯示訂單號并跳轉到支付頁面的效果。這使得用戶可以方便地完成購物過程，并獲得訂單號以便日后查詢和支付。

AJAX技術為網頁開發帶來了許多便利和強大的功能。通過使用AJAX，我們可以在不刷新整個頁面的情況下實現值返回和頁面跳轉的效果，提供更好的用戶體驗。以上示例僅是AJAX的一個簡單用例，AJAX還有很多其他強大的特性和用法等待我們去探索和應用。