使用Ajax實現表單提交后不跳轉是現代Web開發中常見的需求之一。傳統的表單提交會導致頁面的刷新，用戶體驗非常不友好。通過Ajax技術，我們可以在不刷新頁面的情況下發送表單數據，并接收后端服務器的返回結果。本文將介紹如何使用Ajax實現這一功能，并舉例說明其應用場景和效果。 使用Ajax實現表單提交后不跳轉非常簡單，只需要在表單的提交事件中阻止默認的提交行為，并通過Ajax發送表單數據即可。下面是一個簡單的例子：

HTML部分：

<form id="myForm" action="/submit" method="post">
<input type="text" name="name" placeholder="姓名" />
<input type="email" name="email" placeholder="郵箱" />
<input type="submit" value="提交" />
</form>
<div id="result"></div>

JavaScript部分：

<script>
document.getElementById("myForm").addEventListener("submit", function(event) {
event.preventDefault(); // 阻止默認的表單提交行為
var form = document.getElementById("myForm");
var formData = new FormData(form);
var xhr = new XMLHttpRequest();
xhr.open("POST", form.action, true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
document.getElementById("result").innerHTML = xhr.responseText;
}
};
xhr.send(formData);
});
</script>

在上述例子中，我們使用addEventListener方法監聽表單的submit事件，并在事件處理程序中阻止默認的表單提交行為（event.preventDefault()）。然后，我們獲取表單元素和其數據，創建XMLHttpRequest對象，并通過open方法設置請求方法（POST）、請求地址（form.action）和是否異步（true）。接著，我們設置onreadystatechange事件處理函數，用于處理服務器端返回的結果。最后，我們通過send方法發送表單數據。 這樣，當用戶點擊提交按鈕時，瀏覽器會通過Ajax技術發送表單數據到服務器進行處理，然后將結果返回給前端頁面，并在