Fine Uploader文件上传组件应用介绍

发布时间:2022-04-30 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了Fine Uploader文件上传组件应用介绍脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

最近在处理后台数据时需要实现文件上传.考虑到对浏览器适配上采用Fine Uploader. Fine Uploader 采用ajax方式实现对文件上传.同时在浏览器中直接支持文件拖拽[对浏览器版本有要求类似IE版本必须是9或是更高的IE10].在不同浏览器中提供统一用户体验.该组件基本覆盖目前所有主流浏览器.同时没有任何第三方组件依赖.相当Clear.在服务器端已经覆盖支持了ASP.NET/Coldfusion/Java/Node.js/PErl/PHP/Python. 对上传细节类似限制文件大小,文件类型,文件上传数量等通过统一接口以暴露选项方式操作.看到GIThub 上Fine Uploader 按照官方的说法. Fine Uploader前身是Ajax Upload. 新版本Fine Uploader主要添加一些新特性.从1.0版本发布的Realse Note来看.二者最大的区别在于.Fine Uploder不在基于jquery组件.而某些细节处理也更加统一严格.类似返回值全部统一为Json格式.对后台服务器操作和前端Dom对象一些操作Code全部集中Js Script脚本文件中.这样集成使Fine Uploader组件使用非常简单.只需要添加一个CSS+JavaScript文件即可实现文件上传.大大简化用户引用和操作组件难度.

Fine Uploader特点如下

:
Fine Uploader Features:
A:支持文件上传进度显示.
B:文件拖拽浏览器上传方式
C:Ajax页面无刷新.
D:多文件上传.
F:跨浏览器.
E:跨后台服务器端语言.
在Git Hub上Fine Uploader上下载打包码,在PHP Designer 8中打开其源码可以看到其源码结构如下:

Fine Uploader文件上传组件应用介绍


在根目录中可以看到Client客户端调用需要使用文件.Server目录则是对应不同语言Perl/PHP/Asp.net[vb]等版本实现.test目录则有包含一个完整本地Sample Demo.可供参考.
如何快速构建一个简单Demo? 其实官方在Basic-Demo-Page上已经给出一个简单的演示.这里基于Bootstrap方式构建.
首先新建一个HtML空白页面.命名FineUploderDemo.html.添加如下CSS引用如下:
代码如下:

脚本宝典总结

以上是脚本宝典为你收集整理的Fine Uploader文件上传组件应用介绍全部内容,希望文章能够帮你解决Fine Uploader文件上传组件应用介绍所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签:上传组件