AjaxFileUpload Struts2实现多文件上传功能

时间：2021-09-03 来源：互联网编辑：宝哥软件园浏览：次

本文重点给大家介绍Ajax文件上传结构2实现多文件上传功能，具体实现代码大家参考下本文。

单文件和多文件的实现区别主要修改两点，

一是插件ajaxfileupload.js里接收文件文件身份的方式

二是后台行为是数组形式接收

1、ajaxFileUpload文件下载地址http://www.phpletter.com/Demo/AjaxFileUpload-Demo/

2、引入jquery-1.8.0.min.js、ajaxFileUpload.js文件

3、文件上传页面核心代码

正文表单操作=' enctype=' multipart/form-data ' H2多文件上传/h2输入类型=' file ' id=' file 1 ' name=' file '/br输入类型=' file ' id=' file 2 ' name=' file '/br输入类型=' file ' id=' file 3 ' name=' file '/br/span表id='down' /table /span /br输入类型=' button ' onclick=' file upload()；'值='上传/表单/正文脚本类型='text/javascript '函数fileUpload() { var files=['file1 '，' file2 '，' file 3 ']；//将上传三个文件身份分别为文件2,文件2,文件3 $。Ajax文件上传({ URL : '文件上传操作'，//用于文件上传的服务器端请求地址secureuri : false，//一般设置为false fileElementId :文件，//文件上传的编号属性输入类型=' file ' id=' file ' name=' file '/dataType : ' JSON '，//返回值类型一般设置为json成功：函数（数据，状态){ var FIlename=data.fileFileName//返回的文件名var文件路径=数据。文件路径；//返回的文件地址for(var I=0；伊达塔。文件文件名。长度；i ){ //将上传后的文件添加到页面中以进行下载$('#down ').在(' trtd height=' 25 ' ' FIlename[I]'/TDT da href=' downloadFile？downloadFilePath="文件路径[i]”下载/a/TD/tr ')} } })}/脚本以上fileElementId属性接收的文件参数为["文件1"、"文件2"、"文件3"]

由于是多文件，所以我们需要修改ajaxfileupload.js找到以下代码

var oldElement=jQuery(' # ' filelementtid)；var new element=jQuery(oldElement).clone()；jQuery(oldElement).attr('id '，FileID)；jQuery(oldElement).在(新元素)之前；jQuery(oldElement).appendTo(表单);修改为：

for(文件元素id中的var I){ var oldElement=jQuery(' # '文件元素id[I])；var new element=jQuery(oldElement).clone()；jQuery(oldElement).attr('id '，FileID)；jQuery(oldElement).在(新元素)之前；jQuery(oldElement).appendTo(表单);} 4、文件上传行动

公共类文件操作{私有文件[]文件；//文件私有字符串[]文件文件名；//文件名私有字符串[]文件路径；//文件路径私有字符串downloadFilePath//文件下载路径私有InputStream inputStream/** *文件上传* @ return */public String文件上传(){ 0字符串路径=servletactioncontext。getservletcontext().getRealPath('/upload ')；文件文件=新文件（路径);//判断文件夹是否存在，如果不存在则创建文件夹if(！文件。exists()){文件。mkdir()；}请尝试{ if (this.file！=null){ File f[]=this。getfile()；文件路径=新字符串[f .长度]；for(int I=0；我想。长度；I){ String FIlename=Java。乌提尔。uuid。randomuuid().toString()；//采用时间UUID的方式随即命名字符串名称=文件名文件文件名[i].子字符串（文件文件名[i].lastIndexOf(' . '));//保存在硬盘中的文件名文件输入流输入流=新文件输入流(f[I])；文件输出流输出流=新文件输出流(路径' \\ '名称);字节[] buf=新字节[1024];（同Internationalorganizations）国际组织长度=0;而((长度=inputStream.read(buf))！=-1) { outputStream.write(buf，0，长度);} InputStream。close()；输出流。flush()；//文件保存的完整路径//如：d : \ Tomcat 6 \ web apps \ struts _ Ajax file上传\ \上传\ a0be 14 a1-f99e-4239-b54c-b37c 3083134 a . png文件路径[I]=路径' \ \ '名称；} } } catch(异常e){ e . print stack trace()；}返回"成功";} /** * 文件下载* @ return */public String downloadFile(){ String path=downloadFilePath；HttpServletResponse响应=servletactioncontext。getresponse()；尝试{ //路径是指欲下载的文件的路径文件文件=新文件（路径);//取得文件名字符串文件名=文件。getname()；//以流的形式下载文件InputStream fis=new BufferedInputStream(新文件InputStream(路径));字节[]缓冲=新字节[fis。可用()]；fis.read(缓冲区);菲斯。close()；//清空回应。reset()；//设置反应的标题字符串文件名称字符串=新字符串(filename.getBytes('gbk '，' iso-8859-1 ')；回应。添加标题('内容处置'，'附件；filename=' filename string)；回应。添加标题('内容长度')，文件。length())；向客户端输出流=新的BufferedOutputStream(响应。getoutputstream())；回应。setcontenttype(' application/octet-stream ')；toClient.write(缓冲区);给客户。flush()；给客户。close()；} catch(IOexception ex){ ex。print stack trace()；}返回null} /** *省略设置获取方法*/} 5、支柱配置

！DOCTYPE Struts PUBLIC '-//Apache软件基金会//DTD Struts配置2.0//EN ' ' http://Struts。阿帕奇。org/dtds/Struts-2.0。DTD ' Struts包名=' Ajax _ code '扩展=' JSON-default '！-文件上传-action name=' FileUploadAction ' class=' com。这是我的家。“文件操作”方法=“文件上传”结果类型=' JSON ' name=' success ' param name=' content type ' text/html/param/result/action/package name=' JSP _ code ' extends=' struts-default '！-文件下载-action name=' DownLoadFile ' class=' com。这是我的家。“文件操作”方法='下载文件'结果类型=' stream ' param name=' content type ' application/octet-stream/param param name=' input name ' input stream/param param name=' content disposition '附件；fileName=$ { fileName }/param param name=' bufferSize ' 4096/param/result/action/package/struts浏览器中输入：http://localhost :8080/struts _ Ajax文件上传/索引。JSP即可进行文件上传

如图：