AJAX（Asynchronous JavaScript and XML）是一種用于在 Web 頁面上通過 JavaScript 向服務器發送異步請求的技術。在開發過程中，我們有時候需要向服務器提交一個包含多個對象的集合，例如提交一個包含多個學生信息的列表。本文將介紹如何使用 AJAX 提交一個包含多個對象的集合，并給出示例代碼。
在實際開發中，我們常常需要將一組對象集合提交給服務器進行處理。例如，我們有一個學生管理系統，用戶可以選擇多個學生進行編輯，并將編輯后的學生信息一次性提交給服務器保存。這時候，我們可以使用 AJAX 來實現這個功能。
下面是一個示例的學生信息編輯頁面，用戶可以通過勾選多個學生進行編輯：
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<form id="editForm" method="POST" action="/save_students">
<table>
<thead>
<tr>
<th>姓名</th>
<th>年齡</th>
<th>性別</th>
</tr>
</thead>
<tbody>
<tr>
<td>張三</td>
<td>20</td>
<td>男</td>
<td><input type="checkbox" name="students" value="1" /></td>
</tr>
<tr>
<td>李四</td>
<td>21</td>
<td>男</td>
<td><input type="checkbox" name="students" value="2" /></td>
</tr>
<tr>
<td>王五</td>
<td>19</td>
<td>女</td>
<td><input type="checkbox" name="students" value="3" /></td>
</tr>
</tbody>
</table>
<button type="button" onclick="saveStudents()">保存</button>
</form>
<script>
function saveStudents() {
var students = [];
$("input[name='students']:checked").each(function () {
students.push($(this).val());
});
$.ajax({
type: "POST",
url: "/save_students",
data: JSON.stringify(students),
contentType: "application/json",
success: function(result) {
alert("保存成功！");
},
});
}
</script>
</body>
</html>上面的示例代碼中，我們首先定義了一個表單（id 為 "editForm"）用于提交學生信息。在表單中，我們使用了一個表格來展示學生信息，每一行表示一個學生。每個學生信息后面有一個復選框，用于勾選需要編輯的學生。當用戶點擊保存按鈕時，會調用 saveStudents() 函數來獲取勾選的學生信息，并使用 AJAX 發送到服務器端。其中，students 是一個數組，保存的是勾選學生的編號。
在 saveStudents() 函數中，我們使用 jQuery 的 each() 方法遍歷勾選的復選框，將每個復選框的值（即學生的編號）添加到 students 數組中。然后，我們使用 AJAX 的 $.ajax() 方法向服務器提交數據。在這個例子中，我們使用了 POST 方法，將學生信息通過 JSON 格式進行傳輸，并設置 contentType 為 "application/json" 表示傳輸的數據為 JSON 格式。
在服務器端，我們可以使用 Spring MVC、Django 等框架來接收和處理這個請求：
@RestController
public class StudentController {
@PostMapping("/save_students")
public void saveStudents(@RequestBody List<Integer> students) {
// 處理學生信息保存邏輯
}
}上面的示例代碼中，我們使用 Spring MVC 的 @PostMapping 注解來接收 POST 請求，并通過 @RequestBody 注解將請求體中的 JSON 數據映射為 List<Integer> 類型的 students 參數。這樣，我們可以直接在方法中使用 students 參數來獲取提交的學生信息，然后處理相應的保存邏輯。
總結來說，使用 AJAX 提交一個包含多個對象的集合非常簡單。我們只需要在客戶端使用 JavaScript 獲取要提交的對象信息，并通過 AJAX 將數據發送到服務器端。服務器端接收到數據后，可以使用相應的技術將數據映射為集合類型進行處理。