本文共 5074 字,大约阅读时间需要 16 分钟。
1、JSP页面: JS控制增加删除多个上传文件框,代码如下:
- <%@ 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.οnclick=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("请上传后缀名为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">
- 文件上传(可同时上传多份文件)
- </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"
- οnchange="isValidateFile(this);" />
- </td>
- </tr>
- <tr id="fileTr" style="display: none;">
- <td>
- <input type="file" size="50" name="uploadFile"
- οnchange="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>
- 序号
- </th>
- <th>
- 文件名
- </th>
- <th>
- 上传时间
- </th>
- </tr>
- </thead>
- <tbody class="pn-ltbody">
- <tr οnmοuseοver="Pn.LTable.lineOver(this);"
- οnmοuseοut="Pn.LTable.lineOut(this);"
- οnclick="Pn.LTable.lineSelect(this);">
- <td>
- </td>
- <td>
- </td>
- <td>
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- </body>
- </html>
2、Action后台处理上传文件:
-
- private List<File> uploadFile;
-
- private List<String> uploadFileFileName;
-
- public String mUploadFile() {
- if (null == uploadFile) {
- this.addActionError("请上传文件!");
- } else {
- String fileName = "";
- try {
-
- String directory = ServletActionContext.getServletContext().getRealPath("/uploads");
-
- FileUtil.makeDir(directory);
-
- 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代码如下:
- 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;
- }
-
- }
扩展:
1.可以实现带进度条的上传与下载;
2.可以用xml文件记录上传的文件清单,并且可以根据页面对上传文件的操作来修改相应的xml文件;
转载地址:http://ajaji.baihongyu.com/