Uploadify插件在Spring MVC異步單次上傳多文件

概述 在網頁開發中，上傳文件是一個常見的需求。然而，不同瀏覽器對于文件路徑的顯示方式有所不同。由于安全考慮，現代瀏覽器已經不再顯示文件的完整路徑，只會顯示文件名。但是這并不意味著無法進行文件上傳。在

概述

在網頁開發中，上傳文件是一個常見的需求。然而，不同瀏覽器對于文件路徑的顯示方式有所不同。由于安全考慮，現代瀏覽器已經不再顯示文件的完整路徑，只會顯示文件名。但是這并不意味著無法進行文件上傳。在Spring MVC中，我們可以使用CommonsMultipartFile對象與頁面上的表單進行綁定，然后將文件上傳至服務器的臨時文件緩存區，最后將緩存寫入指定位置。

使用Uploadify插件實現異步上傳

在Spring MVC中，我們可以借助第三方插件Uploadify來實現異步上傳多個文件。

準備工作

首先，我們需要引入jQuery和Uploadify插件的相關文件。

lt;script src"jquery.js"gt;lt;/scriptgt;
lt;script src"uploadify/jquery.uploadify.min.js"gt;lt;/scriptgt;
lt;link rel"stylesheet" type"text/css" href"uploadify/uploadify.css"gt;

HTML代碼

接下來，在HTML中添加一個文件上傳的input元素和兩個按鈕用于觸發上傳和取消上傳的操作。

lt;input type"file" id"file_upload"gt;
lt;input type"button" value"上傳" onclick"javascript:$('#file_upload').uploadify('upload', '*');"gt;
lt;input type"button" value"取消上傳" onclick"javascript:$('#file_upload').uploadify('cancel', '*');"gt;

JavaScript代碼

在頁面加載完畢后，我們通過JavaScript初始化Uploadify插件。

lt;scriptgt;
$(function() {
    $('#file_upload').uploadify({
        auto:false, //設置不自動上傳
        swf:'uploadify/uploadify.swf', //swf文件位置
        uploader:'uploadFile.jhtml', //文件上傳地址
        height:32, //“瀏覽”按鈕的高度
        width:50, //“瀏覽”按鈕的寬度
        fileObjName:'anyFile', //將要上傳的文件對象的名稱
        fileTypeExts:'*.jpg;*.jpeg;*.gif;*.png;', //允許上傳的文件后