注:这仅仅是一个粗略笔记。有些代码可能没用。兴许会再更新一个能够使用的版本号。不足之处,敬请见谅。

1。spring环境搭建,这里使用的是spring3的jar,须要同一时候引入common-IO 和common-fileupload的jar包。

1.1spring.XXX.xml文件配置bean

<bean id="multipartResolver"
class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<property name="maxUploadSize" value="${web.maxUploadSize}" />
</bean>

value="xxxx"依据实际情况改动。

2.html表单

<form id="uploadForm" action="data/myData4PipeiUpload" method="post" enctype="multipart/form-data">
<div class="upload_box">
<div class="upload_main">
<div class="upload_choose">
<span id="fileDragArea" class="upload_drag_area">请将文件拖拽至此处上传</span>
<input id="fileImage" size="30" name="fileselects[]" multiple="multiple" type="file">
</div>
<div id="preview" class="upload_preview"></div>
</div> <div id="uploadInf" class="upload_inf"></div>
</div>
<div class="upload_box">
文件名2:
<input name="fileFieName" id="fileFieName" />
</div>
<DIV class="modal-footer">
<BUTTON class="btn btn-primary" type="submit" id="submitBut3" data-dismiss="modal">上传数据文件</BUTTON>
</DIV>
</form>

2.1除了普通上传的一些格式要求之外。这里要注意多文件须要name=“XXX[]” multiple=“multiple"

 <input id="fileImage" size="30" name="fileselects[]" multiple="multiple"  type="file">

2.2这里使用了upload.js和zxxFile.js。去配置相关參数

3.后台代码编写两种方式。

3.1

@RequestMapping(value = "/myData4PipeiUpload", method = RequestMethod.POST)
public void handleRequest(HttpServletRequest request,
HttpServletResponse response) throws Exception {
// 转型为MultipartHttpRequest:
MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
List<MultipartFile> singleFiles = multipartRequest.getFiles("fileselects[]"); if(singleFiles!=null&&singleFiles.size()>0){
for(MultipartFile file: singleFiles){
// 获得文件名称:
String filename = file.getOriginalFilename();
// 获得输入流:
InputStream input = file.getInputStream();
// 写入文件
// 或者:
File source = new File("d:/dd/"+filename);
file.transferTo(source);
}
}
}

注意參数的获取要使用fileselects[]去获取列表

3.2,直接将请求名称写入到@requestParam

@RequestMapping(value = "/myData4PipeiUpload", method = RequestMethod.POST)
public void handleRequest(@RequestParam("fileselects[]") MultipartFile[] files,HttpServletRequest request,
HttpServletResponse response) throws Exception { if(files!=null&&files.length>0){
for(MultipartFile file: files){
// 获得文件名称:
String filename = file.getOriginalFilename();
// 获得输入流:
InputStream input = file.getInputStream();
// 写入文件 // 或者:
File source = new File("d:/dd/"+filename);
file.transferTo(source);
}
}
}

这样子就能够再进行兴许的操作。

spring html5 拖拽上传多文件的更多相关文章

  1. [开源应用]利用HTTPHandler+resumableJs+HTML5实现拖拽上传[大]文件

    前言: 大文件传输一直是技术上的一大难点.文件过大时,一些性提交所有的内容进内存是不现实的.大文件带来问题还有是否支持断点传输和多文件同时传输. 本文以resumableJs为例,介绍了如何在ASP. ...

  2. 基于 jq 实现拖拽上传 APK 文件,js解析 APK 信息

    技术栈 jquery 文件上传:jquery.fileupload,github 文档 apk 文件解析:app-info-parser,github 文档 参考:前端解析ipa.apk安装包信息 - ...

  3. html5 拖拽上传文件时,屏蔽浏览器默认打开文件

    参考: https://www.cnblogs.com/kingsm/p/9849339.html

  4. html5实现拖拽上传

    <html><head> <meta http-equiv="Content-Type" content="text/html; chars ...

  5. html5拖拽事件 xhr2 实现文件上传 含进度条

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  6. HTML5应用之文件拖拽上传

    使用HTML5的文件API,可以将操作系统中的文件拖放到浏览器的指定区域,实现文件上传到服务器.本文将结合实例讲解HTML5+jQuery+PHP实现拖拽上传图片的过程,来看下HTML5的魅力吧. H ...

  7. html5 文件拖拽上传

    本文首先发表在  码蜂笔记 : http://coderbee.net/index.php/web/20130703/266 html5 文件拖拽上传是个老话题了,网上有很多例子,我一开始的代码也是网 ...

  8. [转]人人网首页拖拽上传详解(HTML5 Drag&Drop、FileReader API、formdata)

    人人网首页拖拽上传详解(HTML5 Drag&Drop.FileReader API.formdata) 2011年12月11日 | 彬Go 上一篇:给力的 Google HTML5 训练营( ...

  9. 原生API实现拖拽上传文件实践

    功能: 拖拽上传文件.图片,上传的进度条,能够同时上传多个文件. 完整的demo地址:https://github.com/qcer/FE-Components/tree/master/QDrag 涉 ...

随机推荐

  1. MyBATIS使用CRUD

    MyEclipse不提供自己主动生成,这里提供mybatis文件包和开发文档 http://download.csdn.net/detail/u010026901/7489319 自己建立配置文件, ...

  2. KMP算法详解(转自中学生OI写的。。ORZ!)

    KMP算法详解 如果机房马上要关门了,或者你急着要和MM约会,请直接跳到第六个自然段. 我们这里说的KMP不是拿来放电影的(虽然我很喜欢这个软件),而是一种算法.KMP算法是拿来处理字符串匹配的.换句 ...

  3. jQuery EasyUI API 中文文档 - 链接按钮(linkbutton)

    <html> <head> <script src="jquery-easyui/jquery.min.js"></script> ...

  4. 虚拟机centOS中安装Redis,主机Redis Destop Manager不能访问虚拟机Redis server的解决方案

    今天在学些redis的时候碰到个问题,发现主机Redis Destop Manager不能访问虚拟机Redis server的解决方案,找了一些网上的资料,原因可能有两个,整理记录下来: 1. Red ...

  5. Android开发5:布局管理器2(表格布局TableLayout)

    版本:Android4.3 API18  学习整理:liuxinming 概念      TableLayout继承了LinearLayout,因此它的本质依然是线性布局管理器.      表格布局采 ...

  6. 在Windows如何解决下Cocos2d-x示例代码TestCpp我找不到lib问题库文件

    遇到此问题,首先确定失踪的库文件,然后找到文件夹,库文件. 在编制Cocos2d-x在TestCpp工程,提示缺少lib文件,共同拥有下面2种可靠解决方式: 1.在Cocos2d-x的根文件夹Debu ...

  7. oracle 之 内存—鞭辟近里(四)

    oracle 之 内存—鞭辟近里(四) 今天是2013-07-11日,首先我非常感谢我的哥们也是我的网友杨工,非常感谢他能在大数据库内帮我执行一下我所需要的信息.就是他说的网络真是一个互助友爱的平台. ...

  8. VS Code开发调试.NET Core

    使用VS Code开发 调试.NET Core 应用程序   使用VS Code开发 调试.NET Core RC2应用程序,由于.NET Core 目前还处于预览版. 本文使用微软提供的示例进行开发 ...

  9. 从零开始,创建GitHub团队开发环境

    从零开始,创建GitHub团队开发环境 GitHub提供免费的团队环境,不过免费仓库容量是300MB,请大家注意. 申请GitHub个人账号 1. 使用浏览器访问GitHub主页.如果使用IE,尽量不 ...

  10. Dan计划:重新定义人生的10000个小时 - 阮一峰的网络日志

    Dan计划:重新定义人生的10000个小时 - 阮一峰的网络日志 Dan计划:重新定义人生的10000个小时