JQuery中的Ajax提供了一種方法，可以使您的Web應用程序與服務器上的后端邏輯進行交互，而無需刷新整個頁面。通過使用jQuery，創建請求和獲取結果非常簡單，使您能夠幫助您的用戶快速完成任務。在本文中，我們將學習如何使用JQuery Ajax將表單值自動賦給不同的HTML元素。

$(document).ready(function(){
$('#form').submit(function(){
var formData = $(this).serialize(); // 將表單轉換為字符串
$.ajax({
type: 'POST',
url: 'submitForm.php',
data: formData,
success: function(response){ // 成功響應的處理
$("#result").html(response);
$('#form :input').val(''); // 將表單數據重置為空
}
});
return false; // 防止表單提交頁面重新加載
});
});

在上面的示例中，我們使用了JQuery的serialize()函數，它將表單中的數據轉換為字符串格式，以便我們可以使用AJAX發送POST請求。然后，我們將數據發送給submitForm.php頁面，并在成功響應時處理返回的響應。在此示例中，我們使用response參數將響應顯示在ID為result的HTML元素上，并在成功后將表單輸入重置為空。

為了將表單值自動賦給不同的HTML元素，您可以使用獲取表單元素的值，然后將其分配給另一個具有相應ID的HTML元素。如下所示：

$("#input1").change(function() {
var value = $(this).val();
$("#output1").text(value);
});

在這個例子中，我們監聽id為input1的輸入框上的change事件。然后，獲取值并使用JQuery將其分配給id為output1的另一個HTML元素的文本內容。同樣地，您可以根據需要使用類似的代碼將表單值自動賦給其他HTML元素。

總之，通過使用JQuery Ajax，您可以輕松地將表單值自動賦給不同的HTML元素，而無需任何刷新頁面。這為用戶提供了更好的體驗，并大大提高了Web應用程序的交互性。