本文實(shí)例為大家分享了js struts2多文件上傳的具體代碼，供大家參考，具體內(nèi)容如下
1、jsp頁(yè)面：
js控制增加刪除多個(gè)上傳文件框，代碼如下：
|
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
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
|
<%@ page language="java" pageencoding="utf-8"%> <%@ taglib prefix="s" uri="/struts-tags"%> <!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <%@include file="../../_head.html"%> <title>文件上傳</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <script language="javascript" type="text/javascript" src="../js/common/common.js"></script> <script type="text/javascript"> var pos = 1; function addfilecomponent() { var eltable = document.getelementbyid('uploadtable').getelementsbytagname('tbody')[0]; var eltr = document.getelementbyid('filetr'); var eltr2 = document.getelementbyid('op'); var neweletr = eltr.clonenode(true); neweletr.id = "filetr" + pos; neweletr.style.display = ""; inputs = neweletr.getelementsbytagname('input'); inputs[0].id="file" + pos; var elinput = inputs[1]; elinput.onclick=delfilecomponent; elinput.id="delbutton" + pos++; eltable.insertbefore(neweletr, eltr2); } function delfilecomponent() { var eltable = document.getelementbyid('uploadtable').getelementsbytagname('tbody')[0]; var trarr = eltable.getelementsbytagname("tr"); var el = event.srcelement; for(j = 0; j < trarr.length; j++) { tr = trarr[j]; if(tr.getelementsbytagname("input")[1] == el) { eltable.removechild(tr); pos--; break; } } } function isvalidatefile(obj){ var extend = obj.value.substring(obj.value.lastindexof(".")+1); if(extend==""){ }else{ if(!(extend=="xls"||extend=="doc")){ alert("請(qǐng)上傳后綴名為xls或doc的文件!"); var nf = obj.clonenode(true); nf.value=''; obj.parentnode.replacechild(nf, obj); return false; } } return true; } </script> </head> <body> <%@ include file="/common/message.jsp"%> <div class="body-box"> <div class="rhead"> <div class="rpos"> 文件上傳(可同時(shí)上傳多份文件) </div> <div class="clear"></div> </div> <s:form id="ops" action="csc_muploadfile" theme="simple" cssclass="rhead" enctype = "multipart/form-data"> <table id="uploadtable" width="100%" border="0"> <tr> <td> <input type="file" id="file0" name="uploadfile" size="50" onchange="isvalidatefile(this);" /> </td> </tr> <tr id="filetr" style="display: none;"> <td> <input type="file" size="50" name="uploadfile" onchange="isvalidatefile(this);" /> <input type="button" value="刪除" /> </td> </tr> <tr id="op"> <td> <input type="submit" id="uploadbutton" value="上傳" /> <input type="button" value="添加" id="addbutton" onclick="addfilecomponent();" /> </td> </tr> </table> </s:form> <table class="pn-ltable" width="100%" cellspacing="1" cellpadding="0" border="0"> <thead class="pn-lthead"> <tr> <th> 序號(hào) </th> <th> 文件名 </th> <th> 上傳時(shí)間 </th> </tr> </thead> <tbody class="pn-ltbody"> <tr onmouseover="pn.ltable.lineover(this);" onmouseout="pn.ltable.lineout(this);" onclick="pn.ltable.lineselect(this);"> <td> </td> <td> </td> <td> </td> </tr> </tbody> </table> </div> </body> </html> |
2、action后臺(tái)處理上傳文件：
|
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
|
//uploadfile對(duì)應(yīng)頁(yè)面<input type="file" name="uploadfile"> private list<file> uploadfile; //文件名對(duì)應(yīng)uploadfile+“filename”，要不獲取不到文件名 private list<string> uploadfilefilename; // 文件上傳 public string muploadfile() { if (null == uploadfile) { this.addactionerror("請(qǐng)上傳文件!"); } else { string filename = ""; try { //在自己代碼中控制文件上傳的服務(wù)器目錄 string directory = servletactioncontext.getservletcontext().getrealpath("/uploads"); //判斷該目錄是否存在，不存在則創(chuàng)建 fileutil.makedir(directory); //循環(huán)處理上傳的文件 for(int i=0,j=uploadfile.size();i<j;i++){ filename = uploadfilefilename.get(i); string filepath = directory + file.separator + filename; fileutil.uploadfile(uploadfile.get(i), new file(filepath)); } } catch (ioexception e) { this.addactionmessage(""); } this.addactionmessage("文件上傳成功!"); } return "fileupload"; } |
fileutil代碼如下：
|
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
|
public class fileutil { private static final int buffer_size = 16 * 1024; public static void uploadfile(file src, file dst) throws ioexception { inputstream in = null; outputstream out = null; try { in = new bufferedinputstream(new fileinputstream(src), buffer_size); out = new bufferedoutputstream(new fileoutputstream(dst), buffer_size); byte[] buffer = new byte[buffer_size]; while (in.read(buffer) > 0) { out.write(buffer); } } finally { if (null != in) { in.close(); } if (null != out) { out.close(); } } } public static string getextention(string filename) { int pos = filename.lastindexof("."); return filename.substring(pos); } public static void makedir(string directory) { file dir = new file(directory); if (!dir.isdirectory()) { dir.mkdirs(); } } public static string generatefilename(string filename) throws unsupportedencodingexception { dateformat format = new simpledateformat("yymmddhhmmss"); string formatdate = format.format(new date()); string extension = filename.substring(filename.lastindexof(".")); filename = new string(filename.getbytes("iso8859-1"), "gb2312"); return filename + "_" + formatdate + new random().nextint(10000) + extension; } } |
擴(kuò)展：
1.可以實(shí)現(xiàn)帶進(jìn)度條的上傳與下載；
2.可以用xml文件記錄上傳的文件清單，并且可以根據(jù)頁(yè)面對(duì)上傳文件的操作來(lái)修改相應(yīng)的xml文件；
完畢!
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持服務(wù)器之家。
原文鏈接：https://blog.csdn.net/shimiso/article/details/6045169
