脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 软件编程 → java → JS Struts2多文件上传

JS+Struts2多文件上传实例详解

 更新时间：2018年08月29日 10:41:54   作者：袭烽  
这篇文章主要为大家详细介绍了JS+Struts2多文件上传实例，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

本文实例为大家分享了JS Struts2多文件上传的具体代码，供大家参考，具体内容如下

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.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("请上传后缀名为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" 
                onchange="isValidateFile(this);" />  
            </td>  
          </tr>  
          <tr id="fileTr" style="display: none;">  
            <td>  
              <input type="file" size="50" name="uploadFile" 
                onchange="isValidateFile(this);" />  
              &nbsp;  
              <input type="button" value="删除" />  
            </td>  
          </tr>  
          <tr id="op">  
            <td>  
              <input type="submit" id="uploadbutton" value="上传" />  
              &nbsp;  
              <input type="button" value="添加" id="addbutton" 
                onClick="addFileComponent();" />  
              &nbsp;  
            </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 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后台处理上传文件： 

//uploadFile对应页面<input type="file" name="uploadFile"> 
private List<File> uploadFile;  
//文件名对应uploadFile+“FileName”，要不获取不到文件名 
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文件；

完毕!

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

相关文章

  • Java自定义注解用法实例小结

    Java自定义注解用法实例小结

    这篇文章主要介绍了Java自定义注解用法,结合实例形式总结分析了java常见的自定义注解类型、功能、用法及操作注意事项,需要的朋友可以参考下
    2019-09-09
  • springboot 集成dubbo的步骤详解

    springboot 集成dubbo的步骤详解

    这篇文章主要介绍了springboot 简易集成dubbo的步骤详解,本文结合示例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
    2022-04-04
  • Java实例项目零钱通的实现流程

    Java实例项目零钱通的实现流程

    本篇文章为你带来Java的一个新手实战项目，是一个零钱通系统，项目来自于B站韩顺平老师，非常适合新手入门练习，感兴趣的朋友快来看看吧
    2022-03-03
  • java数据结构排序算法之归并排序详解

    java数据结构排序算法之归并排序详解

    这篇文章主要介绍了java数据结构排序算法之归并排序,结合具体实例形式详细分析了归并排序的原理、实现技巧与相关注意事项,需要的朋友可以参考下
    2017-05-05
  • java 微信小程序code获取openid的操作

    java 微信小程序code获取openid的操作

    这篇文章主要介绍了java 微信小程序code获取openid的操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
    2021-04-04
  • Java_异常类(错误和异常,两者的区别介绍)

    Java_异常类(错误和异常,两者的区别介绍)

    下面小编就为大家带来一篇Java_异常类(错误和异常,两者的区别介绍) 。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
    2016-09-09
  • Java项目实现五子棋小游戏

    Java项目实现五子棋小游戏

    这篇文章主要为大家详细介绍了Java项目实现五子棋小游戏，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2020-05-05
  • spring framework源码调试技巧

    spring framework源码调试技巧

    这篇文章给大家介绍了spring-framework源码调试方法，可以直接将最新代码clone到本地，如果想在代码做一些注释，也可以Fork到自己的仓库。本文采用Fork的方式，并添加了测试module，感兴趣的朋友一起看看吧
    2021-10-10
  • Java接口名称冲突问题的讲解

    Java接口名称冲突问题的讲解

    今天小编就为大家分享一篇关于Java接口名称冲突问题的讲解，小编觉得内容挺不错的，现在分享给大家，具有很好的参考价值，需要的朋友一起跟随小编来看看吧
    2019-04-04
  • Java基础之List内元素的排序性能对比

    Java基础之List内元素的排序性能对比

    这篇文章主要介绍了Java基础之List内元素的排序性能对比,文中有非常详细的代码示例,对正在学习java基础的小伙伴们有非常好的帮助,需要的朋友可以参考下
    2021-04-04

最新评论