Input上传多个文件

注意：
只支持IE10+，连IE9都不支持，o(︶︿︶)o
获取文件的各种属性只能用原生的js，jq不支持。

eg：document.getElementById("file").files[1].name

其中document.getElementById(“file”).files 会获取一个数组，数组中的元素拥有的属性有lastModifiedDate，name，size，type，length、webkitRelativePath。

前台页面：

在input标签中加入 multiple 属性，可以在一个输入框中选择多个文件进行上传

<input type="file" name="uploadfile" id="files" multiple="multiple" />

或者简写：

<input type="file" name="uploadfile" id="files" multiple/>

很多时候上传的时候，我们要限制一下上传文件类型（在windows中主要是限制后缀名）这需要用js取得选择文件的名字：

document.getElementById("files").files[i].name

需要用form提交，点击上传图片动作触发下面代码，进行自己的逻辑处理

function upload(){var files = document.getElementById("files").files;for(var i=0; i< files.length; i++){alert(input.files[i].name);}
}

后台接收：
使用的是Java：spring+springmvc框架
controller接收层代码如下：
@RequestParam(“uploadfile”)中的名字必须和前台页面的name值相同

@RequestMapping("/saveFiles.do")
public String saveFiles(MultipartHttpServletRequest request,@RequestParam("uploadfile") MultipartFile[] uploadfile){//循环数组得到文件并保存for(int i = 0; i < uploadfile.length; i++){MultipartFile multipartFile = uploadfile[i];//循环得到每个文件String name= uploadfile[i].getOriginalFilename();//获取文件名String path=request.getSession().getServletContext().getRealPath("/uploadFile");//文件路径File pathFile = new File(path);//创建file对象if(!pathFile.exists()){//如果不存在pathFile.mkdirs();//创建文件夹并且上传文件file.transferTo(new File(path+name));//文件保存return true;}}
}

ok，到此结束，希望对大家有用，如有不对的地方，希望大家多多指教。

人生当自勉，学习需坚持。从这一刻开始，我依旧是我，只是心境再不同。不论今后的路如何，我都会在心底默默鼓励自己，坚持不懈，等待那一场破茧的美丽。

Input上传多个文件相关推荐

获取当前按钮所在行的input_form表单的input上传文件
在这次的一个小项目中用到了文件的上传,在之前我对form表单的认知还只是发送用户名和密码.行吧,既然用到了那就硬着头皮上咯. 使用首先文件的上传需要一个type=file的input.它的意义就是上 ...
[html] input上传文件可以同时选择多张吗？怎么设置？
[html] input上传文件可以同时选择多张吗?怎么设置? <input type="file" multiple /> 个人简介我是歌谣,欢迎和大家一起交流前后 ...
[html] input上传文件可以同时选择多张吗？怎么设置？
[html] input上传文件可以同时选择多张吗?怎么设置? <input type="file" multiple="multiple" value= ...
原生input标签实现ajax单文件上传和多文件上传
自己还是一个菜鸟的时候,有次项目经理让我用Java做一个多文件上传的功能.那时候技术学得很渣,最多只能够实现单文件上传.做了一个星期都没有做出来,于是项目经理不留半点情面,当着办公室所有人的面痛批我一 ...
如何限制上传服务器的文件容量,如何通过配置php文件限制上传文件的大小
在网站开发的过程中,为了确保能够充分利用服务器的空间,在开发上传功能时,必须对上传文件的大小进行控制.那么我们如何进行对上传文件的大小进行控制呢? 控制文件的大小可以从两个方面入手: 第一个是在PHP ...
thinkphp如何一次性的上传多个文件,在文件域中可以多选?
可以做到类似于某度网盘的样式吗? 文件夹的命名, 可以用单数, 也可以用复数, 在同一个项目中, 只要统一就好了. 毕竟项目开发不同于英语写作. 建议使用缩写, 不管是不是缩写都用单数, 这样简洁,容 ...
java jsp filename filepath 图片上传_SpringMVC实现文件上传与下载
单文件上传: pom.xml: commons-io commons-io 1.3.2 commons-fileupload commons-fileupload 1.2.1 jstl jstl 1. ...
php 拖动多个文件上传,dropzone拖拽文件上传一次上传多个文件的方法
用dropzone插件拖拽文件上传默认情况是把一个文件拖到浏览器后就立即自动上传,参考前文<用dropzone插件拖拽文件上传>,如果需要一次上传多个文件怎么办?本文将介绍其实现方法. d ...
php上传多个文件类型,ThinkPHP上传多文件多类型
首先是使用环境在项目中添加个人信息的时候,需要选择上传图片作为头像还有上传个人简历.头像的格式是必须图片,简历的格式是文档格式(含PDF) 下面是代码带注释//添加用户逻辑操作 public fun ...

Input上传多个文件

Input上传多个文件相关推荐

最新文章

热门文章