Firefox3.6 对多文件选择、上载和精确进度条的支持

原创 2010年01月22日 08:54:00

Firefox 3.6 于 2010年1月22日正式发布,该版本对CSS3和HTML5提供了更多的支持,在 HTML5 方面,提供对访问本地的支持和多文件选择。同时还支持简单拖放操作即可完成。遵守W3C规范的浏览器对Web开发人员来说,是一个最好的喜讯,Firefox每一次小小的更新,都会给大家带来一份惊喜。下面就简单介绍下Firefox3.6对文件上传支持的新功能。
Firefox 3.6支持一次选择多个文件。选择多个文件,只需在input中添加 multiple="true" 属性即可,写法如下:

在用户选择多个文件后,handleFiles函数可以通过FileList对象得到所选择的每个File对象。

通过拖放操作实现文件的多选,只需要先定义一个可拖放的区域,然后添加,dragenter、dragover和drop事件,在drop事件里,可以通过e.dataTransfer.files 得到所选择的文件集合。

对于每一个文件对象,可以通过name属性得到文件名,size属性得到文件的大小,type属性得到文件的MIME 类型,可以使用FileReader对象读取文件的内容。比如,下面的例子是得到文件名、文件大小和文件类型的:

注意:这里判断文件类型的依据好像还是以扩展名来判断的,也就是说是可以通过修改扩展名来伪装的。

另外,还可以通过XMLHttpRequest对象属性文件的上载,通过progress事件可以显示上载的准确进度,下面是mozilla网站提供的一个上载的例子:

 

Firefox3.6 下载地址:

http://www.mozilla.com/en-US/firefox/all.html

相关文章推荐

js实现文件上传—带进度条

上篇博客主要介绍了用asp.net控件实现文件上传,但是还有一个问题 功能是实现了,但是有一个问题来了,上传图片还可以,但是上传视频的时候,因为视频比较大,上传的时间比较长,页面长时间无反应,用户体...

jQuery.validate验证上传文件大小

jQuery.validator.addMethod("checkPicSize", function(value,element) {     var fileSize=element.files...

Oracle:SQL语句--对表的操作——添加一个字段 (即 添加 一列)

– 添加一个字段 (即 添加 一列)(未验证在有数据,并且互有主外键时,是否可用)语法:alter table 表名 add(列名(即 字段名) 数据类型及长度);例:alter table T_St...

cordova加载层、进度条、文件选择插件

http://www.cnblogs.com/laden666666/p/5510625.html 在做cordova项目的时候,感觉应用的响应速度跟原生应用比相差甚远,一个主要问题就是如加...

Volley扩展——文件上传(支持进度条)

volley是一个轻量级的开源网络通信框架,开源的好处就是可以自由定制自己需要的jar包。volley里网络通信时android2.3以上用的HttpUrlConnection,2.3以下用的Http...

使用Html5异步上传文件,支持跨域,带有上传进度条

服务器准备IIS 需要设置IIS里面的HTTP响应标头,如图添加如下设置,添加这项“Access-Control-Allow-Origin”,只有添加了这行才能支持跨域,不然像Chrome浏览器会报...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Firefox3.6 对多文件选择、上载和精确进度条的支持
举报原因:
原因补充:

(最多只允许输入30个字)