本文实例为大家分享了struts2+uploadify多文件上传的具体代码,供大家参考,具体内容如下
首先我这里使用的是 jquery uploadify3.2的版本
导入相关的css js
1
2
3
|
<link rel= "stylesheet" type= "text/css" href= "<%=basepath%>css/uploadify/uploadify.css" rel= "external nofollow" > <script src= "<%=basepath%>js/jquery.min.js" ></script> <script src= "<%=basepath%>js/uploadify/jquery.uploadify.min.js" ></script> |
接下来是 上传的 jsp 页面代码
1
2
3
4
5
6
7
8
9
10
11
|
<form action= "" method= "post" > <input type= "file" name= "img_file" id= "img_file" > <div id= "uploadfilequeue" ></div> <div id= "imgs" ></div> <div id= "dialog-message" ></div> </form> <p> <a href= "javascript:void(0);" rel= "external nofollow" onclick= "myupload()" >上传</a> <a href= "javascript:$('#img_file').uploadify('cancel')" rel= "external nofollow" >取消上传</a> </p> |
这里是最关键的js 代码,有注释
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
|
$(function(){ $( "#img_file" ).uploadify({ auto: false , //是否自动上传 height: 30 , buttontext: '选择图片' , cancelimage: '<%=basepath%>img/uploadify/uploadify-cancel.png' , swf : '<%=basepath %>js/uploadify/uploadify.swf' , // expressinstall:'js/uploadify/expressinstall.swf', uploader : '<%=basepath%>json/fileuploadaction.action' , //后台处理上传文件的action width : 120 , 'multi' : true , //设置为true将允许多文件上传 'filesselected' : '4' , queueid: 'uploadfilequeue' , fileobjname: 'img_file' , //与后台action中file属性一样 /* formdata:{ //附带值 'userid':'111', 'username':'tom', 'rnd':'111' }, */ filetypedesc: '上传文件支持的文件格式:jpg,jpge,gif,png' , filetypeexts: '*.jpg;*.jpge;*.gif;*.png' , //*.jpg;*.jpge;*.gif;*.png queuesizelimit : 4 , //只能一次上传4张图片 // simuploadlimit:1,//一次可以上传1个文件 filesizelimit: '2097152' , //上传文件最大值 单位为字节 2m //返回一个错误,选择文件的时候触发 onselecterror:function(file, errorcode, errormsg){ switch (errorcode) { case - 100 : alert( "上传的文件数量已经超出系统限制的4个文件!" ); break ; case - 110 : alert( "文件 [" +file.name+ "] 大小超出系统限制的2m大小!" ); break ; case - 120 : alert( "文件 [" +file.name+ "] 大小异常!" ); break ; case - 130 : alert( "文件 [" +file.name+ "] 类型不正确!" ); break ; } }, // //上传到服务器,服务器返回相应信息到data里 onuploadsuccess:function(file, data, response){ var objs = eval( '(' +data+ ')' ); var phtml = "<span><img style='width:150;height:150' src='/uploads/" +objs.filename+ "'></span>" ; if ($( "#imgs span" ).length== 0 ){ $( "#imgs" ).html(phtml); } else { $( "#imgs span:last" ).after(phtml); } }, onselect : function(file) { //alert(file.name); }, //removecompleted:true,//上传的文件进度条是否消失 requeueerrors: false , // removetimeout:2,//进度条消失的时间,默认为3 progressdata: "percentage" , //显示上传的百分比 onuploaderror : function(file,errorcode,errormsg,errorstring,swfuploadifyqueue) { //这里是取消的时候发生 // $("#dialog-message").html(errorstring); } }); }); //上传文件 function myupload(){ $( "#img_file" ).uploadify( 'upload' , '*' ); } |
java 上传的action 代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
|
/** * 上传文件的action * @author wzh * */ @controller @scope ( "prototype" ) public class fileuploadaction extends baseaction { private file img_file; private string img_filecontenttype; //格式同上"filename"+contenttype private string img_filefilename; //格式同上"filename"+filename private string savepath; //文件上传后保存的路径 private map<string, object> datamap = new hashmap<string, object>(); @override /*** * 上传文件 */ public string execute() throws exception{ system.out.println( "savepath" +getsavepath()); file dir= new file(getsavepath()); system.out.println(dir.getabsolutepath()); //判断是否存在路径 if (!dir.exists()){ dir.mkdirs(); } //当前上传的文件 file file=getimg_file(); //获得后缀 string ext =fileutil.getextensionname(getimg_filefilename()); string newfilename = uuid.randomuuid()+ext; fileoutputstream fos= new fileoutputstream(getsavepath()+ "//" +newfilename); fileinputstream fis= new fileinputstream(getimg_file()); byte []buffers= new byte [ 1024 ]; int len= 0 ; while ((len=fis.read(buffers))!=- 1 ){ fos.write(buffers, 0 ,len); } fos.close(); fis.close(); // string uploadfilename = getimg_filefilename(); datamap.put( "filename" ,newfilename); return success; } |
1
2
3
4
5
6
7
|
<!-- 文件上传相关的 --> <action name= "fileuploadaction" class = "fileuploadaction" > <param name= "savepath" >e:/tomcat6. 0 /webapps/uploads</param> <result type= "json" > <param name= "root" >datamap</param> </result> </action> |
配置完以上的基本就ok了。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。
原文链接:https://blog.csdn.net/CJaver/article/details/38317455