1、下载及初始化

https://github.com/blueimp/jQuery-File-Upload

下载插件解压放到项目任意位置,在页面中引入文件上传依赖jQuery、jQuery UI widget factory(如果已引入jQuery UI则不用引入)、jQuery Iframe Transport plugin(支持XHR文件上传的插件),除此之外还有可选插件,如Bootstrap、JavaScript Load Image library等。

jqueryhtml5上传图片插件头像截图/图像截取上传表单前端开辟功效壮大的jQuery文件上传插件jQuery File Upload NoSQL
(图片来自网络侵删)

然后在body中创建一个文件类型的input元素,设置id、name、data-url属性。

末了写入如下代码,运行脚本,一个最大略的文件上传就完成了。

2、产品特点

多文件上传

可以同时选择多个文件并上传。

支持拖拽

许可拖拽上传文件,从你的桌面拖拽或文件管理,把他们拖到你的浏览器窗口。

可撤销上传

可以取消停滞上传单个文件上传。

可规复上传

可以规复单个文件上传。

分块上传

大文件支持分成多个小块上传。

客户端图像调度

图片在客户端可以自动调度大小。

预览图像、音频和视频

支持图像、音频和视频文件预览。

不须要浏览器插件(例如Adobe Flash)

jQuery File Upload是基于开放标准的HTML5和JavaScript实现的,不须要任何浏览器插件。

HTML表单文件上传

许可通过利用一个标准的HTML文件上传表单部件元素。

跨域文件上传

支持上传文件到另一个域和跨站点。

可定制和扩展

供应了一个API来设置各个选项,为各种上传事宜定义回调方法。

兼容任何做事器端运用程序平台

适用于任何做事器端平台(PHP、Python、Ruby on Rails、Java、Node.js、Go etc)

桌面浏览器兼容:

Google Chrome

Apple Safari 4.0+

Mozilla Firefox 3.0+

Opera 11.0+

Microsoft Internet Explorer 6.0+

移动端浏览器兼容:

Apple Safari on iOS 6.0+

Google Chrome on iOS 6.0+

Google Chrome on Android 4.0+

Default Browser on Android 2.3+

Opera Mobile 12.0+

详情前往官网查看:

https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support

有哪里写得不好的地方请大家提出来,请轻喷,感激。
同时有什么与编程干系的好东西可以保举给我,再次感谢!