Эта популярная статья была обновлена в июле 2016 года и отражает текущее состояние плагинов для загрузки файлов. Комментарии, относящиеся к старой статье, были удалены.
Реализация загрузки файлов с помощью Ajax может быть очень сложной, особенно если вам нужны такие функции, как поддержка перетаскивания, предварительный просмотр изображений или индикаторы выполнения. Следующие 10 плагинов для загрузки файлов jQuery имеют множество опций и отличные пользовательские интерфейсы, которые быстро позволят вам реализовать красивый загрузчик файлов.
1. FineUploader
FineUploader — это гибкий, активно поддерживаемый загрузчик, написанный на чистом JavaScript, но также доступный как плагин jQuery. По сравнению со всеми другими подключаемыми модулями, представленными ниже, в нем реализованы самые интересные и уникальные функции: приостановка / возобновление загрузки, одновременное разбиение на фрагменты, загрузка <canvas>
2. Dropzone.js
Dropzone.js — это загрузчик файлов, доступный в чистом JavaScript и jQuery, с параметрами практически для всего, такими как предварительный просмотр изображений (миниатюры), указание максимального размера файла, переименование файлов при загрузке, параллельная загрузка или изменение размера изображений при загрузке. Документация понятна и проста для чтения, хотя существует около 500 открытых вопросов (ошибок и запросов функций), многие из которых были открыты годами, поэтому имейте в виду, что вы можете быть самостоятельно, если у вас возникнут проблемы.
Интернет сайт
Исходный код
Дополнительная статья о Dropzone.js: как создать форму для загрузки файлов с помощью Express и Dropzone.js
3. Загрузка файла jQuery
Как и Dropzone.js (# 1), выгрузка файлов jQuery предлагает вам очень похожие наборы опций для ваших нужд (хотя и с другим пользовательским интерфейсом), а также готовые интеграции для пользовательского интерфейса jQuery и AngularJS. Он очень популярен, поэтому вы найдете много ответов о StackOverflow , но в проекте отключены проблемы на GitHub, и документация может быть трудной для чтения.
4. Plupload
Plupload — отличный выбор, если вы хотите начать со встроенного пользовательского интерфейса из коробки. Он предлагает вам меньше возможностей для настройки, но несколько десятков тем с языковыми пакетами и откатами Flash или Silverlight.
5. Загрузка Formstone
Formstone — это набор полезных веб-компонентов, включая Upload, отдельный плагин для загрузки файлов jQuery. Поскольку он предлагает только базовые параметры для настройки, а пользовательский интерфейс очень прост, начать работу очень просто.
6. jQuery.filer
Этот плагин ориентирован на отличный встроенный пользовательский интерфейс и основан на модульной архитектуре, которая позволяет легко включать или отключать компоненты и задавать пользовательские темы. Кроме того, он предлагает вам класс PHP для обработки запросов на загрузку.
7. Загрузочный файл ввода
Bootstrap File Input — это плагин загрузки файлов Bootstrap 3.x с jQuery API, который поставляется со всем необходимым для настройки. Он позволяет не только просматривать загруженные изображения, но также текст, HTML, видео, аудио, Flash и объектные файлы.
8. jQuery Загрузить файл
jQuery Upload File — простой плагин загрузки со всеми основными опциями, а также предварительным просмотром изображений, локализацией и возможностью создания собственного пользовательского интерфейса с настраиваемыми шаблонами. Поскольку у него есть пример для каждой функции, реализация должна идти быстро.
9. jQuery HTML5 Uploader
Этот загрузчик позволяет перетаскивать файлы в элемент (например, <div> Не больше и не меньше.
10. Загрузить
Uploadify — это плагин для загрузки jQuery на основе Flash, который добавляет кнопку выбора на ваш сайт. Поскольку настройка ограничена, форум поддержки закрыт, и Flash не следует использовать вообще, его не рекомендуется использовать больше. Есть еще один плагин, называемый UploadiFive, который основан на HTML5 и доступен на том же веб-сайте, но на момент написания этой статьи коммерческая лицензия стоила 100 долларов.
Чаевые
Иногда у вас — или у ваших клиентов — могут быть особые требования, и вам потребуется создать пользовательский интерфейс без jQuery или придерживаться определенного руководства по стилю. В этом случае вас могут заинтересовать следующие два проекта, которые позволяют вам осуществлять загрузку файлов с полностью самодельными пользовательскими интерфейсами:
Вывод
Это самые известные плагины на рынке. Если у вас есть опыт работы с ними — хороший или плохой — или у вас есть другой заслуживающий внимания плагин для загрузки файлов, сообщите нам об этом в комментариях.