本文將探討Ajax（Asynchronous JavaScript and XML）技術在提交form表單時的格式。Ajax是一種在后臺與服務器進行異步通信的技術，通過它可以在不刷新整個頁面的情況下更新部分頁面內容。在提交form表單時，可以使用Ajax來實現(xiàn)無刷新的表單提交，并且可以對服務器返回的響應進行處理，使用戶體驗更加友好。下面舉例說明幾種常見的Ajax提交form表單的格式。

1. 使用FormData

FormData是一種可以將form表單數(shù)據(jù)轉化為鍵值對的對象?？梢允褂肍ormData構造函數(shù)來創(chuàng)建一個FormData對象，然后使用append()方法將form表單中的數(shù)據(jù)添加到FormData對象中：

var formData = new FormData();
formData.append('username', 'John');
formData.append('password', '123456');
var xhr = new XMLHttpRequest();
xhr.open('POST', 'submit.php', true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
// 處理服務器返回的響應
console.log(xhr.responseText);
}
};
xhr.send(formData);

上述代碼中，使用FormData對象將username和password兩個表單字段的值添加到formData對象中，并將該對象通過XMLHttpRequest對象的send()方法發(fā)送到服務器。服務器端可以通過相應的處理方式來獲取并處理這些表單數(shù)據(jù)。

2. 直接將form表單數(shù)據(jù)作為請求參數(shù)

除了使用FormData對象，還可以直接將form表單數(shù)據(jù)作為請求的參數(shù)，通過GET或POST方式提交?？梢允褂胘Query庫中的serialize()方法來將form表單數(shù)據(jù)序列化成URL編碼的字符串：

$(document).ready(function() {
$('form').submit(function(e) {
e.preventDefault();
var formData = $(this).serialize();
$.ajax({
url: 'submit.php',
type: 'POST',
data: formData,
success: function(response) {
// 處理服務器返回的響應
console.log(response);
}
});
});
});

上述代碼中，通過serialize()方法將form表單數(shù)據(jù)序列化成formData字符串，然后將該字符串作為data參數(shù)傳遞到$.ajax()函數(shù)中。服務器端可以通過相應的處理方式來獲取并處理這些表單數(shù)據(jù)。

3. 使用JSON格式提交form表單數(shù)據(jù)

如果需要將form表單數(shù)據(jù)以JSON格式提交到服務器，可以先將form表單數(shù)據(jù)轉換為JavaScript對象，然后再將JavaScript對象轉換為JSON字符串：

$(document).ready(function() {
$('form').submit(function(e) {
e.preventDefault();
var formData = {};
$(this).find('input').each(function() {
formData[$(this).attr('name')] = $(this).val();
});
var jsonData = JSON.stringify(formData);
$.ajax({
url: 'submit.php',
type: 'POST',
data: jsonData,
contentType: 'application/json',
success: function(response) {
// 處理服務器返回的響應
console.log(response);
}
});
});
});

上述代碼中，通過遍歷form表單中的input元素，將每個元素的name屬性作為鍵，元素的值作為值，將所有鍵值對組成的對象賦值給formData。然后使用JSON.stringify()方法將formData對象轉換為JSON字符串，最后將該字符串作為data參數(shù)傳遞到$.ajax()函數(shù)中，并設置contentType為'application/json'，表示請求的數(shù)據(jù)類型為JSON。

通過上述幾種不同的方式，可以實現(xiàn)使用Ajax提交form表單，并對服務器返回的響應進行處理，提升用戶的交互體驗和頁面的性能。根據(jù)實際需求選擇不同的方式來提交form表單數(shù)據(jù)，可以更好地滿足業(yè)務需求。