使用Ajax 在單一表單中上傳資料和檔案
使用jQuery 和Ajax 與表單互動時，通常會提交以下任一內容資料或文件，但不能同時進行。當您需要上傳兩種類型的內容時，這可能會帶來挑戰。
問題說明
主要問題在於提交前收集資料和文件的方式不同。資料通常使用 .serialize() 方法進行序列化，而文件則使用 FormData 物件進行處理。
解決方案
透過以下方式以一種形式上傳資料和檔案Ajax，您可以利用 FormData 的強大功能。該物件可讓您輕鬆組合兩種類型的內容。操作方法如下：
<form>
$("form#datafiles").submit(function(e) {
e.preventDefault();
var formData = new FormData(this); // Gather both data and files into a single FormData object
$.ajax({
url: window.location.pathname, // Your PHP endpoint URL
type: 'POST',
data: formData,
success: function(data) {
alert(data); // Output the response from your PHP script
},
cache: false,
contentType: false,
processData: false
});
});PHP 腳本
在伺服器端，您的 PHP 腳本將能夠存取您提交的資料和檔案。形式。您可以使用 $_POST 和 $_FILES 來檢索此資訊。
<?php // Display contents of $_POST print_r($_POST); // Display contents of $_FILES print_r($_FILES); ?>
結論
透過使用 FormData，您可以輕鬆地從單一提交資料和檔案中使用 Ajax 形成。這種方法簡化了您的表單並提高了文件和資料管理的效率。
以上是如何使用 Ajax 以單一表單同時上傳資料和檔案？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
