有没有好的 jQuery 拖放文件上传插件?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/1663741/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is there a good jQuery Drag-and-drop file upload plugin?
提问by Peter Boughton
Is there a nice tidy jQuery plugin that allows including a single JS script then using a simple snippet to enable a form? Something like this:
是否有一个漂亮整洁的 jQuery 插件,它允许包含单个 JS 脚本,然后使用一个简单的代码段来启用表单?像这样的东西:
$j('#MyForm').enableDragDropUploads('.upload-area')
With the upload target being the action of the form.
上传目标是表单的操作。
Any solution must not prevent a regular file field from being usable (using traditional browse method).
任何解决方案都不能阻止常规文件字段的使用(使用传统浏览方法)。
I only need one file at a time, though of course having the option for multiple isn't a bad thing.
我一次只需要一个文件,当然可以选择多个文件并不是一件坏事。
I've found a couple of drag-drop upload examples:
http://www.appelsiini.net/2009/10/drag-and-drop-file-upload-with-google-gearshttp://www.appelsiini.net/2009/10/html5-drag-and-drop-multiple-file-upload
我发现一对夫妇的拖放上传的例子:
http://www.appelsiini.net/2009/10/drag-and-drop-file-upload-with-google-gears HTTP://www.appelsiini。 net/2009/10/html5-drag-and-drop-multiple-file-upload
But the code there isn't setup as a plugin. It's probably not too difficult to change it, but also no point doing so if someone else has already done that work and is simply evading my Google searches.
但是那里的代码没有设置为插件。改变它可能并不太难,但如果其他人已经完成了这项工作并且只是逃避我的谷歌搜索,那么这样做也没有意义。
I'm ideally looking for a pure HTML5/jQuery solution.
A Google Gears one is acceptable, but a Flash solution is not.
我理想地寻找纯 HTML5/jQuery 解决方案。
Google Gears 是可以接受的,但 Flash 解决方案不是。
采纳答案by Ciaran
Have a look at this one: http://aquantum-demo.appspot.com/file-upload
看看这个:http: //aquantum-demo.appspot.com/file-upload
It also handles multiple file upload!
它还可以处理多个文件上传!
回答by Aaron Wagner
回答by Tommy W
http://blueimp.github.com/jQuery-File-Upload/= great solution
http://blueimp.github.com/jQuery-File-Upload/= 很好的解决方案
According to their docs, the following browsers support drag & drop:
根据他们的文档,以下浏览器支持拖放:
- Firefox 4+
- Safari 5+
- Google Chrome
- Microsoft Internet Explorer 10.0+
- 火狐 4+
- Safari 5+
- 谷歌浏览器
- 微软 Internet Explorer 10.0+
回答by Ross Gledhill
If you're looking for one that doesn't rely on Flash then dropzonejs is a good shout. It supports multiple files and drag and drop.
如果您正在寻找不依赖 Flash 的产品,那么 dropzonejs 是一个不错的选择。它支持多个文件和拖放。
回答by resopollution
If you are still looking for one, I just released mine: http://github.com/weixiyen/jquery-filedrop
如果你还在找,我刚刚发布了我的:http: //github.com/weixiyen/jquery-filedrop
Works for Firefox 3.6 right now. I decided not to do the Chrome hack for now and let Webkit catch up with FileReader() in the next versions of Safari and Chrome.
现在适用于 Firefox 3.6。我决定暂时不做 Chrome hack,让 Webkit 在 Safari 和 Chrome 的下一个版本中赶上 FileReader()。
This plugin is future compatible.
这个插件是未来兼容的。
FileReader() is the official standard over something like XHR.getAsBinary() which is deprecated according to mozilla.
FileReader() 是 XHR.getAsBinary() 之类的官方标准,根据 mozilla 已弃用。
It's also the only HTML5 desktop drag+drop plugin out there that I know of which allows you to send extra data along with the file, including data that can be calculated at the time of upload with a callback function.
它也是我所知道的唯一一个 HTML5 桌面拖放插件,它允许您随文件一起发送额外的数据,包括可以在上传时使用回调函数计算的数据。
回答by user340084
I created a plugin which allows you to drop some files onto a given area. This plugin currently works in Firefox, Safari and Chrome.
我创建了一个插件,它允许您将一些文件放到给定区域。此插件目前适用于 Firefox、Safari 和 Chrome。
回答by Liyan Chang
Shameless Plug:
无耻的插头:
Filepicker.iohandles uploading for you and returns a url. It supports drag/drop, cross browser. Also, people can upload from Dropbox/Facebook/Gmail which is super handy on a mobile device.
Filepicker.io为您处理上传并返回一个 url。它支持拖放,跨浏览器。此外,人们可以从 Dropbox/Facebook/Gmail 上传,这在移动设备上非常方便。
回答by John Laniba
How about the latest version of jQuery Fileuploader: http://pixelcone.com/fileuploader/
最新版本的 jQuery Fileuploader 怎么样:http://pixelcone.com/fileuploader/
Its a powerful file upload plugin, very easy to setup compared to other plugin, and its now support html5 api.
它是一个强大的文件上传插件,与其他插件相比非常容易设置,并且它现在支持 html5 api。