1. 在input标签中加入 multiple 属性,可以在一个输入框中选择多个文件进行上传
<input type="file" name="img" multiple="multiple" />
当然,这样也是一样的: 
<input type="file" name="img" multiple />
附一段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框多文件上传的更多相关文章

  1. UI自动化之特殊处理二(弹框\下拉框\选项\文件上传)

    弹框\下拉框\选项\文件上传也是一些比较特殊的操作 目录 1.弹框 2.下拉框 3.选项 4.文件上传 1.弹框 弹框有三种形式,value为alert.confirm.prompt三种的弹框,第一个 ...

  2. javascript input type=file 文件上传

    在JS中,input type=file 是常用的文件上传API,但感觉W3C说的不是很清楚,同时网上的资料也比较乱. 由于做微信开发,所以网页打算尽量少用第三方库或者插件,以加快网页的加载速度.因为 ...

  3. 动态input file多文件上传到后台没反应的解决方法!!!

    其实我也不太清除具体是什么原因,但是后面就可以了!!! 我用的是springMVC 自带的文件上传 1.首先肯定是要有springMVC上传文件的相关配置! 2.前端 这是动态input file上传 ...

  4. js 实现 input type="file" 文件上传示例代码

    在开发中,文件上传必不可少但是它长得又丑.浏览的字样不能换,一般会让其隐藏点其他的标签(图片等)来时实现选择文件上传功能 在开发中,文件上传必不可少,<input type="file ...

  5. input type='file'文件上传自定义样式

    使用场景: 在未使用UI库时免不了会用到各种上传文件,那么默认的上传文件样式无法达到项目的要求,因此重写(修改)上传文件样式是必然的,下面的效果是最近项目中自己写的一个效果,写出来做个记录方便以后使用 ...

  6. [置顶] js 实现 <input type="file" /> 文件上传

    在开发中,文件上传必不可少,<input type="file" /> 是常用的上传标签,但是它长得又丑.浏览的字样不能换,我们一般会用让,<input type ...

  7. jspsmartupload 文件上传让input数据和文件上传同时提交

    一.使用原因: 文件上传时,表单的属性中必须要有multipart/form-data,如以下例子: <form name="form_post" class="a ...

  8. 可编辑的el-table表格,结合input输入,upload文件上传的表格

    最近整理了一下,table表格的编辑状态,把一般表格里需要输入的类型都放进来了,实现的功能如图     这里面的input输入框没什么好说的,绑定对应的值就可以,要注意的是组件上传的upload,这个 ...

  9. input type="file"文件上传到后台读取

    html页面(表单采用bootStrap) js部分: //更换头像时把上传的图片post方式到控制器 <script type="text/javascript"> ...

随机推荐

  1. MyBatis简介与配置

    1.1MyBatis简介 MyBatis 是一个可以自定义SQL.存储过程和高级映射的持久层框架.MyBatis 摒除了大部分的JDBC代码.手工设置参数和结果集重获.MyBatis 只使用简单的XM ...

  2. 建站手册-浏览器信息:Internet Explorer 浏览器

    ylbtech-建站手册-浏览器信息:Internet Explorer 浏览器 1.返回顶部 1. http://www.w3school.com.cn/browsers/browsers_inte ...

  3. VTemplate模板引擎的使用--进阶篇

    1.<vt:template>与<vt:include>标签的不同 <vt:template>和<vt:include> 标签都包含file属性,如果这 ...

  4. JavaScript实现10大算法可视化

    参考博客: https://www.cnblogs.com/Unknw/p/6346681.html#4195503 十大经典算法 一张图概括: 名词解释: n:数据规模 k:“桶”的个数 In-pl ...

  5. Django框架(二十一)—— Django rest_framework-权限组件

    目录 Django rest_framework-权限组件 一.权限组件的使用 1.使用语法 2.全局使用.局部使用.局部禁用权限 二.源码分析 1.Book中没有as_view 2.APIView的 ...

  6. P4363 [九省联考2018]一双木棋

    题面 这种搜索要把后继状态都跑出来之后取Min/Max 也就是回溯的时候进行操作 记得用hash进行记忆化(用map不开O2会TLE) #include<iostream> #includ ...

  7. mysql全局权限账户%登录不上ERROR 1045 (28000): Access denied for user 'zzq'@'localhost' (using password: YES)

    mysql中有新建了一个%(允许所有主机连接)和ALL权限的账户.但是竟然连不上.用root或者其他localhost的用户却可以登录.首先检查下防火墙打开了没,可以用service iptables ...

  8. JS提示信息来检测相应id的标签

    2015-07~2015-08 (其中$为document.getElementById()) 使用span提示信息来检测相应id的标签,没有返回值 infoTips("LRYH" ...

  9. android中的国际化

    java国际化步骤: 定义资源文件: baseName_language_country.properties baseName_language.properties baseName.proper ...

  10. Codeforces 346C Number Transformation II 贪心(复杂度计算)

    题意及思路:https://www.cnblogs.com/liuzhanshan/p/6560499.html 这个做法的复杂度看似是O(n ^ 2),实际上均摊是O(n)的.我们考虑两种极端数据: ...