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 框上传多个文件

最新文章

热门文章