input 框上传多个文件
- 在input标签中加入 multiple 属性,可以在一个输入框中选择多个文件进行上传
<input type="file" name="img"multiple="multiple"/>
当然,这样也是一样的:
<input type="file" name="img" multiple />
2.很多时候上传的时候,我们要限制一下上传文件类型(
在windows中主要是限制后缀名
),或者是把选择的文件名(路径)输出到当前页面,,
这需要用js取得选择文件的名字: document.getElementById("input").files[i].name 3.后台接收,java就要看使用的框架了,struts应该只需要把对应的成员变量改成数组就OK吧(推测),
比较老的项目,可能没有引用框架,或者说框架没有考虑到这部分,就需要修改文件上传的代码了,这里
只说其中一种情况(我遇到的)。 后台接收到的流是放到一个Map中的,但是在put的时候,Map的key使用的是标签的name属性,这样会导致
选择的多个文件只能接到一个文件(Map中的Key值不能重复,前面put的就被后面的覆盖了)。 这种情况可以使用上传文件的名作为Map的key值,这样会影响到其他的模块,主要是map中的key变化后,其他模块
在取得流的时候,可能会接不到(标签名和文件名是会有很大的不同的)。
我的做法是,在页面埋一个hidden,用js填充上上传文件的名(注意是多个),这样后台就可以得到上传文件的名,
然后就没有我的事了 附一段Demo:
<!DOCTYPE HTML>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<body>
<script type="text/javascript">
function onc(){
var files = document.getElementById("input").files;
for(var i=0; i< files.length; i++){
alert(input.files[i].name);
}
}
</script>
<form action="/example/html5/demo_form.asp" method="get">
选择图片:<input type="file" id="input" name="input" onchange="onc()" multiple="multiple" />
<input type="submit" />
</form>
<p>请尝试在浏览文件时选取一个以上的文件。</p>
</body>
</html>
input 框上传多个文件的更多相关文章
- 单个input框上传多个文件操作
HTML页面: <div class="form-group thumb"> <label class="control-label col-xs-12 ...
- 使用html中的<input>标签上传多个文件(转)
如何使用html上传多个文件呢?我搜索中文怎么也找不到合适的,都是用js动态添加input,然后提交,不能满足我想要的——打开选择文件的窗口后可以一次性选择多个文件. 然后我尝试搜索英文"h ...
- JS ajaxfileUpload 一次性上传多个input控件 上传多个文件
本方法适用于一次性上传多个input框输入的文件,如下图所示,任务是需要一次上传两个input框提供的两个文件. 具体方法: 1.修改ajax调用方法 如上图所示,只需要将ajaxFileUpload ...
- ajax+ashx 完美实现input file上传文件
1.input file 样式不能满足需求 <input type="file" value="浏览" /> IE8效果图: Firefox效 ...
- 如何用一张图片代替 'input:file' 上传本地文件??
今天去面试,碰到了一道题,也许是因为紧张或者喝水喝多了,一时竟然没有转过弯来,回来之后一细想原来这么简单,哭笑不得,特此记录一下! 原题是这样的: 如何用一张图片代替 'input:file' 上传 ...
- thinkphp如何一次性的上传多个文件,在文件域中可以多选?
可以做到类似于某度网盘的样式吗? 文件夹的命名, 可以用单数, 也可以用复数, 在同一个项目中, 只要统一就好了. 毕竟项目开发不同于英语写作. 建议使用缩写, 不管是不是缩写都用单数, 这样简洁,容 ...
- [js]uploadify结合jqueryUI弹出框上传,js中的冒出的bug,又被ie坑了
引言 最近在一个项目中,在用户列表中需要对给没有签名样本的个别用户上传签名的样本,就想到博客园中上传图片使用弹出框方式,博客园具体怎么实现的不知道,只是如果自己来弄,想到两个插件的结合使用,在弹出框中 ...
- Spring MVC-------文件上传,单文件,多文件,文件下载
Spring MVC 框架的文件上传是基于 commons-fileupload 组件的文件上传,只不过 Spring MVC 框架在原有文件上传组件上做了进一步封装,简化了文件上传的代码实现,取消了 ...
- SpringMVC文件上传下载(单文件、多文件)
前言 大家好,我是bigsai,今天我们学习Springmvc的文件上传下载. 文件上传和下载是互联网web应用非常重要的组成部分,它是信息交互传输的重要渠道之一.你可能经常在网页上传下载文件,你可能 ...
随机推荐
- svn log操作
查看当前文件夹的最近N次提交记录 svn update; svn log --limit <N> -v 含义是:查询最近N次提交记录的详细信息,包括版本号,提交文件列表,log信息 对比某 ...
- reflow和repaint区别?
作者:zccst 重绘和重排之前也知道,但也没有可以详细了解他们的机制,区别,以及对性能的影响. A repaint occurs when changes are made to an elemen ...
- jquery页面滑到底部加载更多
$(window).scroll(function(){ var _scrolltop = $('body').scrollTop();if(_scrolltop+_winHeight>_doc ...
- UAC下的程序权限提升
来源:http://blog.kingsamchen.com/archives/801 UAC是微软为了提高Windows的安全性,自Windows Vista开始引入的新安全机制. 传统的NT内核系 ...
- QWidget QMainWindow QDialog 三个基类的区别
Qt类是一个提供所需的像全局变量一样的大量不同的标识符的命名空间.通常情况下,你可以忽略这个类.QObject和一些其它类继承了它,所以在这个Qt命名空间中定义的所有标识符通常情况下都可以无限制的使用 ...
- 进程waitpid()的用法
代码分析: /* waitpid.c */ #include <sys/types.h> #include <sys/wait.h> #include <unistd.h ...
- webView缩放
self.webview.scalesPageToFit = YES; 可以让webView内容用缩放手势放大或缩小
- grep过滤搜索
cat /proc/2666/maps | busybox grep libumcpart.so
- org.springside.modules.orm中的page类自我解读
// // Source code recreated from a .class file by IntelliJ IDEA // (powered by Fernflower decompiler ...
- BP神经网络的Java实现
http://fantasticinblur.iteye.com/blog/1465497