Ajax是一種在網頁中使用異步請求的技術，可以實現在不刷新整個頁面的情況下與服務器進行數據交互。在傳統的Ajax中，我們可以通過發送GET或POST請求向服務器傳遞參數，并獲取服務器返回的數據。然而，當需要同時上傳文件和傳遞其他參數時，傳統的Ajax就有些力不從心了。本文將介紹如何使用Ajax同時上傳文件和傳遞參數，并通過舉例說明其實現方法。

假設我們有一個文件上傳頁面，用戶可以選擇一個文件并輸入姓名和年齡等信息。我們希望能夠將選擇的文件上傳至服務器，同時將姓名和年齡等參數傳遞給服務器進行處理。傳統的Ajax方法是無法同時上傳文件和傳參的，因為文件上傳需要使用form表單，而表單無法同時包含其他參數。

解決這個問題的方法是使用FormData對象。FormData是一個用于創建表單數據的API，它可以將表單中的控件值或提交表單的整個表單數據序列化為一個可通過AJAX進行傳輸的字符串。通過FormData對象，我們可以實現同時上傳文件和傳遞參數的需求。

function uploadFile() {
var name = document.getElementById("name").value;
var age = document.getElementById("age").value;
var fileInput = document.getElementById("file");
var file = fileInput.files[0];
var formData = new FormData();
formData.append("name", name);
formData.append("age", age);
formData.append("file", file);
var xhr = new XMLHttpRequest();
xhr.open("POST", "upload.php", true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
console.log(xhr.responseText);
// 處理服務器返回的數據
}
};
xhr.send(formData);
}

在上面的代碼中，我們首先通過getElementById方法獲取姓名和年齡輸入框的值，以及文件輸入框的文件。然后，我們創建一個FormData對象，并通過append方法將姓名、年齡和文件添加到FormData中。接下來，我們創建一個XMLHttpRequest對象，并通過open方法指定請求的方法、URL和是否異步。在onreadystatechange事件中，我們檢查請求狀態是否為4（請求已完成）和狀態碼是否為200（請求成功），如果滿足條件，則表示上傳和傳參成功。最后，我們通過send方法將FormData發送到服務器。

需要注意的是，在服務器端接收和處理上傳文件和傳遞的參數時，需要針對文件和其他參數進行不同的處理。例如，在PHP中，可以通過$_FILES數組獲取上傳的文件，通過$_POST或$_GET數組獲取其他參數。

綜上所述，通過使用FormData對象，我們可以很方便地實現同時上傳文件和傳遞參數的需求。無論是上傳圖片、用戶頭像還是其他文件，都可以通過這種方式實現。這種方法在實際開發中非常實用，幫助我們解決了傳統Ajax無法同時上傳文件和傳參的問題。