HTML5技术

如何不依靠JS或Flash来使用HTML5传输多文件

字号+ 作者: 来源:    2014-11-17 18:29 我要评论( )

虽然现在已经可以通过表单的方式用浏览器向服务器传输文件,尤其是input type=file这种表单控件,然而这东西一次最多只能传递一个文件。如果用户需要上传整个相册或者多张图片,那么技术人员只好从其他途径想...

虽然现在已经可以通过表单的方式用浏览器向服务器传输文件,尤其是<input type=file>这种表单控件,然而这东西一次最多只能传递一个文件。如果用户需要上传整个相册或者多张图片,那么技术人员只好从其他途径想办法了,比如Flash或者JS。但是现在通过HTML5提供的新标签,我们就可以完全不需要那些额外的东西了。HTML5为上传文件提供了几个新标签,比如multiple就是为了支持多文件上传专用的。multiple是一个bool标签来表示是否允许用户上传多个文件。比如<input type="file" multiple/>在最新版的Safari, Chrome, FireFox, IE以及Opera都是支持的。至于控件的外观渲染那就是各种浏览器自己的事情了。为了能让用户一次性选择多个文件,用户将可用Shift或者Ctrl或者CMD按键逐个点击要添加的文件。
 
如何使用
从技术角度看,你只需要在input控件中标注multiple标签就够了
以下就是演示代码:
01 <!DOCTYPE html>
02  
03 <html>
04  
05 <head>
06  

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 如何快速处理线上故障 - 倒骑的驴

    如何快速处理线上故障 - 倒骑的驴

    2017-05-02 12:01

  • 如何在 ASP.NET Core 中发送邮件 - Savorboard

    如何在 ASP.NET Core 中发送邮件 - Savorboard

    2017-05-02 08:02

  • 对于Bootstrap的介绍以及如何使用 - novai-L

    对于Bootstrap的介绍以及如何使用 - novai-L

    2017-04-29 09:00

  • 谈一下我们是如何开展code review的 - HarlanC

    谈一下我们是如何开展code review的 - HarlanC

    2017-04-27 15:03

网友点评