AjaxFileUpload.js 是一個用于實現多文件上傳的 JavaScript 庫。要實現多文件上傳,請按照以下步驟操作:
<script src="path/to/jquery.min.js"></script>
<script src="path/to/ajaxfileupload.js"></script>
<form id="fileupload" action="your_server_upload_script" method="POST" enctype="multipart/form-data">
<input type="file" name="files" id="files" multiple>
<button type="submit">Upload</button>
</form>
注意 multiple
屬性允許用戶選擇多個文件。
<script>
$(document).ready(function() {
$('#fileupload').ajaxFileUpload({
// 服務器端上傳腳本
url: 'your_server_upload_script',
// 自動上傳。如果設置為 false,用戶需要點擊上傳按鈕。
autoUpload: true,
// 同時上傳的文件數量限制。默認為 1。
maxNumberOfFiles: 5,
// 文件上傳前的預處理。例如,可以在這里調整文件大小或類型。
beforeSend: function(files) {
// 返回 false 可以阻止文件上傳。
return true;
},
// 文件上傳成功后的回調函數。
success: function(data, status) {
console.log('Upload success:', data, status);
},
// 文件上傳失敗后的回調函數。
error: function(data, status, e) {
console.log('Upload error:', data, status, e);
},
// 完成上傳(無論成功還是失敗)后的回調函數。
complete: function() {
console.log('Upload complete');
}
});
});
</script>
實現服務器端上傳腳本(例如 PHP、Python 或 Node.js 等)。這個腳本負責接收并處理上傳的文件。具體實現取決于你使用的服務器端技術。
配置服務器端腳本以處理多文件上傳。確保服務器端腳本可以接收多個文件,并將它們保存到服務器的指定位置。
完成以上步驟后,你應該可以使用 AjaxFileUpload.js 實現多文件上傳功能。用戶可以選擇多個文件并點擊上傳按鈕,文件將被發送到服務器端腳本進行處理。上傳成功或失敗后,你可以在客戶端和服務器端分別執行相應的回調函數。