今天我們來討論一個非常有用的技術——Ajax。Ajax（Asynchronous JavaScript and XML）是一種在網頁中實現異步數據交互的技術，通過在后臺與服務器進行少量數據交換，可以使網頁實現局部刷新，提高用戶體驗。在這篇文章中，我們將著重討論如何使用Ajax提交表單的完整代碼。下面我們將會通過舉例來詳細介紹。
首先，讓我們來看一個簡單的表單，其中包含一個名稱字段和一個電子郵箱字段。用戶可以在這個表單中輸入自己的名稱和郵箱地址，并且通過點擊提交按鈕來將數據發送到服務器。

html
<form id="myForm">
<label for="name">名稱:</label>
<input type="text" id="name" name="name"><br><br>
<label for="email">電子郵箱:</label>
<input type="text" id="email" name="email"><br><br>
<button type="submit">提交</button>
</form>

在這個例子中，我們給表單添加了一個id屬性，用于在JavaScript中引用。同時，我們還給提交按鈕添加了一個type屬性為"submit"，用于觸發表單的提交。
接下來，讓我們來編寫使用Ajax提交表單的代碼。首先，我們需要監聽表單的提交事件，并在事件發生時阻止表單的默認行為（即進行頁面的刷新）。

javascript
document.getElementById("myForm").addEventListener("submit", function(event){
event.preventDefault();
});

在上面的代碼中，我們通過getElementById方法獲取到表單，并使用addEventListener方法來添加一個"submit"事件監聽器。在事件處理函數中，我們使用event.preventDefault()方法來阻止表單的默認提交行為。
接下來，讓我們來獲取表單中的數據，并使用Ajax將數據發送到服務器。我們可以使用XMLHttpRequest對象來發送一個POST請求，并將表單數據作為請求的正文。

javascript
document.getElementById("myForm").addEventListener("submit", function(event){
event.preventDefault();
var name = document.getElementById("name").value;
var email = document.getElementById("email").value;
var xhr = new XMLHttpRequest();
xhr.open("POST", "submitForm.php", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send("name=" + name + "&email=" + email);
});

在上面的代碼中，我們首先獲取了名稱字段的值和電子郵箱字段的值。然后，我們創建了一個新的XMLHttpRequest對象，并使用open方法來指定請求的類型、URL和是否異步。
接著，我們使用setRequestHeader方法設置請求頭部的Content-Type為"application/x-www-form-urlencoded"，這是常用的表單提交格式。最后，我們使用send方法將表單數據作為參數發送到服務器。
以上就是使用Ajax提交表單的完整代碼。通過上面的代碼，我們可以在用戶填寫完表單并點擊提交按鈕后，使用Ajax技術將表單數據發送到服務器，而不需要刷新整個頁面。這樣一來，用戶就可以獲得更加流暢和無縫的體驗。
總結起來，Ajax是一種非常強大和靈活的技術，可以在不刷新整個頁面的情況下進行數據交互。通過使用Ajax提交表單，我們可以在用戶輸入完表單數據后，異步地將數據發送到服務器，同時保持頁面的流暢和響應。希望本文對你在學習和使用Ajax提交表單方面有所幫助。