在現代的 Web 開發中，我們經常需要通過 AJAX（Asynchronous JavaScript and XML）技術和服務器進行數據的交互。AJAX 技術能夠實現無需刷新整個頁面，只更新部分內容的動態加載效果。其中，數據的回傳扮演著非常重要的角色，它使得服務器能夠接收來自客戶端的數據，并做出相應的處理和響應。本文將通過舉例說明，詳細介紹 AJAX 中如何回傳數據，并給出代碼示例。
假設我們正在開發一個待辦事項列表的應用程序，用戶可以在頁面上添加待辦事項，并將其存儲到服務器上，以便能夠隨時查看和管理。在這種情況下，我們需要使用 AJAX 技術將用戶輸入的待辦事項傳遞給服務器并實現數據回傳。
首先，我們需要在前端編寫 Ajax 請求的代碼。常見的方式是使用 JavaScript 的 XMLHttpRequest 對象或者使用更便捷的 jQuery.ajax 函數。我們可以在客戶端編寫一個函數，當用戶點擊添加按鈕時調用該函數，并將待辦事項作為數據傳遞給服務器。
以下是一個使用原生 JavaScript 的代碼示例：

html
<script>
function addTodoItem() {
var todo = document.getElementById("todoInput").value;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
// 回傳成功后的處理
console.log(this.responseText);
}
};
xhttp.open("POST", "addTodo.php", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("todo=" + todo);
}
</script>

在上述代碼中，我們首先獲取用戶輸入的待辦事項，然后創建一個 XMLHttpRequest 對象，并定義了一個回調函數用于處理服務器端的響應。接下來，我們通過xhttp.open()方法指定請求的類型、URL 和是否異步處理。這里我們使用 POST 請求類型，并將待辦事項作為數據傳遞給服務器。最后，我們通過xhttp.send()方法將請求發送到服務器。
在服務器端，我們需要接收并處理來自客戶端的數據。以 PHP 為例，我們可以編寫以下代碼：

php
<?php
$todo = $_POST['todo'];
// 進行數據的存儲和處理
echo "添加成功";
?>

在這個簡單的例子中，我們使用了 PHP 的$_POST超全局變量來接收來自客戶端的數據。注意，我們必須確保前端發送請求時所使用的請求數據的名稱與服務器端代碼中的接收變量名稱一致。在這里，我們將用戶輸入的待辦事項保存到$todo變量中，然后進行數據的存儲和處理。最后，通過調用echo函數返回一個回傳的字符串，表示操作成功。
當服務器對數據進行處理后，我們可以在客戶端的回調函數中獲取服務器的響應，并根據需要進行進一步的處理。在上述代碼的回調函數中，this.responseText屬性保存了服務器的響應內容。我們可以將其打印到控制臺或者將其顯示到頁面上的某個元素中。
總結來說，通過 AJAX 技術，我們可以實現數據的回傳，使得前端與后端之間能夠進行數據的交互。在前端，我們可以使用 JavaScript 的 XMLHttpRequest 對象或者 jQuery.ajax 函數來發送請求和獲取響應。在后端，我們可以使用各種服務器端技術來接收和處理來自客戶端的數據。無論是傳遞簡單的字符串還是復雜的數據對象，AJAX 都能靈活地完成數據的回傳任務。當然，為了確保數據的安全性和完整性，我們還需要進行一定程度的驗證和過濾。