12个最好的 HTML5 jQuery 文件上传脚本

jopen 10年前

1. jQuery File Upload Demo

The basic plus UI version of this script allows features which everyone is looking forward for like multiple file selection, drag & drop support, progress bars, validation and preview images, audio and video for jQuery. Supports cross-domain, chunked and resumable file uploads and client-side image resizing. Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads.

Features of interest

  • Drag & Drop
  • Html Progress bar
  • Add multiple files
  • Resume file uploads
  • File validation and size information
  • Cancel Upload
  • Delete upload files
  • Show alerts when upload fails
  • Responsive Widget Plugin
  • Free Script
  • Submit start upload button to upload.
DemoDownload

1.jpg

 

2. Fine Uploader

Javascript plugin tool to give your users a smooth experience when uploading files to your website. Fine Uploader aims to make file-uploading on the web possible in every browser and mobile device. It is cross-browser, dependency-free, and 100% Javascript.

Features of Interest

  • Drag & Drop Files
  • Switch Image Preview On/Off
  • With or Without Submit Buttons
  • Limit file size
  • Disallow certain file formats
  • Limit number of multiple items to be uploaded.
  • Html Progress bar
  • Upload direct to Amazon S3 storage.
  • Error message with popup
  • Queue Files
  • Instant Uploads
  • Flat list of uploaded files with no preview.
  • Option for iframe-based uploads.
  • Free Download
DemoDownload

2.jpg

 

3. HTML5 File Uploads with jQuery

Today we will be developing a small web application called Upload Center, that will allow people to upload photos from their computers by dragging and dropping them onto the browser window, possible with the new HTML5 APIs exposed by modern browsers.

Features of Interest

  • Minimal Drag & Drop Interface
  • Html Progress bar
  • No Submit Buttons
  • Instant upload of  images
  • Only images allowed.
  • Only support Chrome & Firefox.
  • Preview of images.
  • Free to use.
DemoDownload

3.jpg

4. Plupload v2.0.0

Allows you to upload files using HTML5, Gears, Silverlight, Flash, BrowserPlus or normal forms, providing some unique features such as upload progress, image resizing and chunked uploads.

Features of Interest

  • Add Multiple Files
  • Flash based progress bar
  • Image resizing on the fly
  • Queued Files
  • Submit button for uploading files.
  • Error message for format others than images.
  • Stop upload anytime.
  • Total filesize
  • Free script
DemoDownload

4.jpg

5. Uploadify HTML5 File Upload jQuery Script

A fully customizable script to do the file uploading process easy. Uploadify™ is a jQuery plugin that allows you to easily add multiple file upload functionality to your website.

Features of Interest

  • Multiple File Uploads
  • Drag & Drop
  • Real-Time Progess bars
  • Specifiy restrictions for file
  • Premium support
  • HTML5 version costs 5$
DemoDownload

 

6. jQuery Fileuploader Plugin

jQuery fileuploader plugin is a powerful plugin which was designed for simplicity. It was inspired by uploadify but its functionality and concept is different. jQuery fileuploader uses html5 api which support ajax upload and drag and drop, and fallback to iframe upload for legacy browsers.

Features of interest

  • Multi File Selection & Upload
  • Image only
  • Files are Queued
  • Submit button to upload
  • Platform Independent
  • Html Progress bar
  • Html5 Drag & Drop
  • Free script
DemoDownload

6.jpg

7. Ajax+PHP Multi Images-Multi Files Uploader

Ajax+PHP Multi Images-Multi Files Uploader is a tool (and not a full Gallery) to upload multiple Images and/or Files using the same form. In addition is bundled with many features to make your life easier.

Features of interest

  • Multi File upload
  • Progess bar without flash
  • Drag & Drop
  • Upload any file (txt, pdf, jpg etc)
  • Crop uploaded images
  • Webcam captures
  • Responsive Design
  • Add image descriptions
  • Bootstrap 3 Ready
  • No page refresh
  • Premium script costing $6
DemoDownload

7.jpg

8. The AwsmUploader: Unlimited Uploads w/o Flash!

The AwsmUploader lets you easily upload files by drag-n-drop (built-in) or by feeding it with files from own sources (such as regular file-inputs). It was built using plain JavaScript, HTML5 and PHP (that’s all it needs).
The AwsmUploader does not require any of these: Flash, ActiveX, Chrome extensions, 3rd party libraries (e.g. jQuery, Dojo, MooTools, Modernizr), plug-ins of any type, server-side frameworks etc.

Features of Interest

  • Drag & Drop Support
  • Multiple file upload and queuing
  • Set file size limit on the fly
  • Limit Maximum parallel uploads
  • Set image thumbnails ON/OFF
  • Big progress bar to drop files
  • No Flash
  • Supports all desktop & mobile browsers
  • Upload huge multiple file formats
  • Responsive Design
  • Real time file uploads
  • Premium script costing $12
DemoDownload

8.jpg

 

9. HTML5 Pure Uploader

The pure  uploader script which pushes the boundaries of normal image uploaders and also other file type scripts. Add watermark to the uploaded image and resize them easily.

Features of Interest

  • Drag & Drop Files
  • Upload any file types
  • Cancel uploads
  • Image watermark and resize.
  • Multiple files at a time
  • Start upload button
  • Responsive Design
  • HTML5 Progress bar
  • All top browser support
  • Error customization
DemoDownload

9.jpg

10. Quform – Responsive Ajax Contact Form

Quform is a powerful responsive ajax contact form that you can easily embed into any web page in a matter of minutes.  This contact form lets you place attachment files with ease and will sent the same to the recipient.  A perfect guest post scenario or uploading resume for a job you are interested in. The form data is saved to the database so a database is a must for this jQuery Ajax script.

Important Features

  • Multiple File upload
  • Restrict the submission of form with many factors
  • Responsive design
  • Works in all major browsers
  • Tested on all mobile devices (with android or iOS)
  • Form validation & filtering
  • Form data saved to a database
  • Autoresponsders
  • All file formats supported for upload.
  • Easy integration to a HTML or a php page.
  • Premium script costing $6
  • Over 4000 sales
DemoDownload

10.jpg

11. Small File Uploader

Small Uploader is a PHP script which allows uploading multiple files WITHOUT using Flash. This file uploader uses AJAX and will not force the page to reload. The feedback about uploading files are given through it’s well designed user interface. This script is perfect for uploading small files.

Features

  • Switch Drag and Drop On/Off
  • Doesn’t use Flash
  • Server upload errors are shown
  • Display file size and type
  • Limit file size
  • Multiple file type support
  • Its light weight.

11.jpg

12. FileGator

A completely different script for completely different use as this not your everyday needy script. Upload, edit, manage, zip and share files and folders. A upload plugin to rule them all and this is the plugin you are looking for, if you are into filehosting service. Similar related service i can think of is rapidshare, mediafire, hotfile etc.

Features

  • Add multiple files
  • Manage Uploaded Files
  • Thumbnail view of uploaded images
  • Zip files online
  • Move files to any folder
  • Create folder online
  • User registration
  • Interface to Manage user accounts
  • Send file via email.
  • Premium script costs $9.
  • Interesting concept.
DemoDownload

12.jpg