最近幾年，隨著互聯網技術的不斷發展，前端開發中涉及到異步數據請求的情況變得越來越普遍。而其中 ajax 這個不可或缺的工具，為我們提供了一種在不刷新頁面的情況下實現異步數據交互的方式。本文將重點介紹如何使用 ajax 同時傳輸 FormData 和 JSON 數據。通過舉例說明，我們將看到這種技術的實際運用與優勢。 在一些使用場景中，我們不僅需要傳輸普通的表單數據，還需要傳輸文件數據。例如，在一個圖片上傳的功能中，我們需要將用戶上傳的圖片數據一并發送給后端進行處理，同時還需要將其他表單數據（例如標題、描述等）一同提交。這時候，我們就可以使用 Ajax 同時傳輸 FormData 和 JSON 數據。 假設我們有一個上傳圖片和文字描述的功能，頁面中包括一個表單，其中有一個 input 用于選擇圖片，另外兩個 input 分別用于輸入標題和描述。而后端服務器會根據這些數據對圖片進行處理，并將處理結果返回。 首先，我們要創建一個 FormData 對象，將表單數據和文件數據添加到其中。然后，我們需要創建一個 JSON 對象，將其他表單數據轉換為 JSON。 ```html

上傳

``` ```javascript``` 接下來，我們需要使用 Ajax 發送這兩個數據。在這個過程中，我們需要設置請求頭（Content-Type 為 multipart/form-data）和請求體（包括 FormData 和 JSON 字符串）。 ```javascript``` 以上代碼的核心是通過 FormData.append() 方法將 formData 和 jsonData 添加到 formDataAndJson 中。通過 xhr.send() 方法將 formDataAndJson 發送給后端服務器。 綜上所述，我們可以通過 Ajax 同時傳輸 FormData 和 JSON 數據，實現將表單數據和文件數據一并發送給后端進行處理的功能。這樣的技術可以應用于各種場景，例如圖片上傳、音頻上傳等等。通過這種方式，我們提高了數據交互的效率，減少了網絡請求的次數，提升了用戶體驗。