jQuery File Upload Plugin
演示
演示地址
說明
本jQuery插件支持多文件上傳,拖拽文件上傳,進(jìn)度條,預(yù)覽圖片、視頻和音頻。
支持跨域上傳,分塊上傳和可恢復(fù)的文件上傳和客戶端圖像調(diào)整??梢栽谥С謽?biāo)準(zhǔn)HTML表單文件上傳的所有服務(wù)端平臺(tái)工作,包括PHP, Python, Ruby on Rails, Java, Node.js, Go等等。
安裝
技術(shù)支持
-
Support Forum
使用過程產(chǎn)生的問題和關(guān)于本插件的討論可以發(fā)到 Support Forum
如果你的問題和本插件關(guān)系不大,你在Stack Overflow提問可能會(huì)得到更好的回應(yīng)。
-
Bugs反饋和新特性
Bugs反饋和請(qǐng)求新特性可以使用issues tracker.
在發(fā)帖前請(qǐng)先閱讀issue guidelines
特性
多文件上傳:
允許一次選擇多個(gè)文件并同時(shí)上傳到服務(wù)器支持拖拽文件上傳:
允許你從桌面或者文件夾直接拖拽要上傳的文件到瀏覽器上傳。上傳進(jìn)度條:
進(jìn)度條顯示單個(gè)文件或者所有文件上傳進(jìn)度情況。可撤銷上傳:
可以撤銷單個(gè)文件的上傳。可恢復(fù)上傳:
如果瀏覽器支持Blob API,被打斷的上傳可以恢復(fù)上傳。分塊上傳:
如果瀏覽器支持Blob API,大文件可以分成幾個(gè)小塊文件上傳。客戶端圖像調(diào)整:
如果瀏覽器支持所需要的Javascript API,在客戶端可以自動(dòng)調(diào)整圖片的大小。預(yù)覽圖像,音頻和視頻:
如果瀏覽器支持所需要的Javascript API,在上傳服務(wù)器之前可以預(yù)覽圖像,音頻和視頻。不需要瀏覽器插件(例如Adobe Flash):
本插件的實(shí)現(xiàn)是基于開放標(biāo)準(zhǔn)的HTML5和JavaScript,因此不需要額外的插件。瀏覽器優(yōu)雅降級(jí):
如果瀏覽器支持xmlhttprequest,文件通過xmlhttprequest上傳到服務(wù)器,否則傳統(tǒng)瀏覽器通過iframes上傳文件。HTML文件表單上傳漸進(jìn)增強(qiáng):
允許通過使用一個(gè)標(biāo)準(zhǔn)的HTML文件上傳表單以部件元素的方式漸進(jìn)增強(qiáng)。跨域文件上傳:
支持跨站點(diǎn)xmlhttprequest或者iframe重定向的方式跨域上傳文件多次插件使用:
允許在一個(gè)網(wǎng)頁使用多次插件可定制和可擴(kuò)展:
提供了一系列API來設(shè)置各個(gè)選項(xiàng),為各種上傳事件定義回調(diào)方法。multipart和文件內(nèi)容流上傳:
文件可以以標(biāo)準(zhǔn)的”multipart/表單數(shù)據(jù)”或文件內(nèi)容流(以HTTP PUT方式上傳文件)兼容任何服務(wù)器端應(yīng)用程序平臺(tái):
可以在支持標(biāo)準(zhǔn)HTML表單文件上傳的所有服務(wù)端平臺(tái)工作,包括PHP, Python, Ruby on Rails, Java, Node.js, Go等等。
環(huán)境需求
強(qiáng)制要求:
- jQuery v. 1.6+
- jQuery UI widget factory v. 1.9+ (包括)
- jQuery Iframe Transport plugin (包括)
The jQuery UI widget factory的存在是出于本插件最基本的需要,但是它非常輕量級(jí),并不依賴于 jQuery UI套件。
The jQuery Iframe Transport的存在是出于那些不支持XHR方式上傳文件的瀏覽器的需要。
可選的要求:
- JavaScript Templates engine v. 2.5.3+
- JavaScript Load Image library v. 1.11.0+
- JavaScript Canvas to Blob polyfill v. 2.1.0+
- blueimp Gallery v. 2.12.0+
- Bootstrap CSS framework v. 3.0.0+
- Glyphicons
The JavaScript Templates engine是為了呈現(xiàn)Basic Plus UI版本和jQuery UI版本的被選擇和上傳的文件樣式。
The JavaScript Load Image library 和 JavaScript Canvas to Blob polyfill 的存在是出于實(shí)現(xiàn)圖像預(yù)覽和調(diào)整功能的需要。
The blueimp Gallery 用來顯示在lightbox已上傳的圖片
所有版本的用戶界面除了jQuery UI的版本是建立在Twitter的Bootstrap CSS framework和Glyphicons 的基礎(chǔ)上。
跨域要求:
Cross-domain File Uploads使用Iframe Transport plugin需要一個(gè)重定向到源服務(wù)器獲取上傳結(jié)果。示例中利用result.html作為源服務(wù)器的靜態(tài)重定向頁面。
倉庫里還有 jQuery XDomainRequest Transport插件,該插件可以去掉Microsoft Internet Explorer 8 and 9 的跨域 AJAX請(qǐng)求限制 (IE 10支持跨域 XHR 請(qǐng)求)。
XDomainRequest對(duì)象僅允許GET和POST請(qǐng)求,不支持文件上傳。它是用于Demo刪除上傳的文件從跨域演示文件上傳服務(wù)。
瀏覽器
桌面瀏覽器
本插件做了定期測(cè)試以保證兼容最新的瀏覽器版本和以下常用最低的瀏覽器版本:
Google Chrome
Apple Safari 4.0+
Mozilla Firefox 3.0+
Opera 11.0+
Microsoft Internet Explorer 6.0+
手機(jī)瀏覽器
本插件經(jīng)過測(cè)試,兼容以下手機(jī)瀏覽器版本:
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+
支持的功能
想知道每個(gè)瀏覽器支持的功能詳情請(qǐng)看瀏覽器支持信息延伸閱讀.
許可證
在MIT 許可證下發(fā)布.
原文地址
譯者:m_cat
(PS:第一次翻譯技術(shù)文章,如有不對(duì)之處或者對(duì)于翻譯你有更好的建議,歡迎聯(lián)系我。)