本文整理了7款基于JavaScript和AJAX的檔案上傳插件,這些插件基本上都能實作以下功能:
- 多檔案上傳
- 拖拽操作
- 實時上傳進度
- 自定義上傳限制
希望能為你的開發工作帶來幫助。
1. jQuery File Upload
具有多檔案上傳、拖拽、進度條和圖像預覽功能的檔案上傳插件,支援跨域、分塊、暫停恢複和用戶端圖像縮放。可與任何服務端平台(如PHP、Python、Ruby on Rails、Java、Node.js、Go等)一起使用,支援标準的HTML表單檔案上傳。
![](https://img.laitimes.com/img/__Qf2AjLwojIjJCLyojI0JCLicGcq5CMyMDOyUTZ5gTMiFTL0QjZh1yY1I2MtIGOzMWLwcjNiNjN0QzLcVzNwEzLchjNwAzLcRnbl1GajFGd0F2LcRWYvxGc19CXt92YuUWelRXauwGZvw1LcpDc0RHaiojIsJye.jpg)
2. Pixelcone Fileuploader
使用HTML5 API的jQuery檔案上傳插件,支援AJAX上傳和拖拽操作,以及針對老版本浏覽器的iframe上傳部件。有多種形式來實作多檔案上傳,每種形式由單一的上傳腳本來控制。
3. Ajax Upload
該插件使用XHR來上傳多個檔案,支援拖拽操作,可以在FF3.6+、Safari4+、Chrome等浏覽器中完美運作。
4. Plupload
這是一個針對CMS或類似系統的、高度可用的上傳插件。支援分塊、拖拽、圖像縮放、限制檔案大小、顯示上傳進度等。
5. Uploadify
Uploadify是一個jQuery插件,幫助你在網站中輕松添加多檔案上傳功能,提供了兩個版本(HTML5、Flash)。支援多檔案上傳、拖拽、實時進度顯示,提供了大量的定制功能。
6. Ajax File Upload
該插件是Ajaxupload插件的修改版本,不具備HTML5功能。
7. jQuery FileDrop
該插件使用HTML5 API,允許使用者從桌面拖動多個檔案到浏覽器中,并上傳每個檔案到使用者指定的URL。該插件使用HTML5 FileReader()來讀取檔案資料。