web-dev-qa-db-ja.com

優れたjQueryドラッグアンドドロップファイルアップロードプラグインはありますか?

単一のJSスクリプトを含めることができ、フォームを有効にするために簡単なスニペットを使用できる、すてきなjQueryプラグインはありますか?このようなもの:

$j('#MyForm').enableDragDropUploads('.upload-area')

アップロードターゲットはフォームのアクションです。

どのソリューションでも、通常のファイルフィールドが使用可能になるのを妨げてはなりません(従来のブラウズ方法を使用)。

一度に必要なファイルは1つだけですが、もちろん複数のオプションを用意することは悪いことではありません。

ドラッグアンドドロップアップロードの例をいくつか見つけました。
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

しかし、そこのコードはプラグインとしてセットアップされていません。おそらく変更するのはそれほど難しいことではありませんが、他の誰かが既にその作業を行っており、単にGoogleの検索を回避しているのであれば、変更することは意味がありません。

理想的には、純粋なHTML5/jQueryソリューションを探しています。
Google Gearsのものは受け入れられますが、Flashソリューションは受け入れられません。

173
Peter Boughton

これを見てください: http://aquantum-demo.appspot.com/file-upload

また、複数のファイルのアップロードも処理します!

134
Ciaran

最近チェックしてください1 TinyMCEエディターを作成した人からアップロードハンドラーをリリースしました。 jQueryウィジェットがあり、機能とフォールバックの素晴らしいセットがあるように見えます。

http://www.plupload.com/

30
Aaron Wagner

http://blueimp.github.com/jQuery-File-Upload/=素晴らしいソリューション

docs によると、次のブラウザーはドラッグアンドドロップをサポートしています。

  • Firefox 4以降
  • Safari 5以降
  • グーグルクローム
  • Microsoft Internet Explorer 10.0+
18
Tommy W

あなたがまだ探しているなら、私はちょうど私をリリースしました: http://github.com/weixiyen/jquery-filedrop

現在、Firefox 3.6で動作します。今のところChromeハックを行わず、WebkitがSafariとChromeの次のバージョンでFileReader()に追いつくことを決めました。

このプラグインは将来互換性があります。

FileReader()は、XHR.getAsBinary()のようなものに対する公式の標準であり、mozillaに従って非推奨です。

また、コールバック関数を使用してアップロード時に計算できるデータなど、追加のデータをファイルとともに送信できることがわかっている唯一のHTML5デスクトップドラッグアンドドロッププラグインでもあります。

15
resopollution

Flashに依存しないものを探しているなら、dropzonejsがいいでしょう。複数のファイルとドラッグアンドドロップをサポートしています。

http://www.dropzonejs.com/

13
Ross Gledhill

特定の領域にいくつかのファイルをドロップできるプラグインを作成しました。このプラグインは現在、Firefox、Safari、Chromeで動作します。

http://code.google.com/p/dnd-file-upload/

9
user340084

恥知らずなプラグ:

Filepicker.io はアップロードを処理し、URLを返します。ドラッグアンドドロップ、クロスブラウザーをサポートしています。また、モバイルデバイスでは非常に便利なDropbox/Facebook/Gmailからアップロードできます。

8
Liyan Chang

JQuery Fileuploaderの最新バージョンはどうですか: http://pixelcone.com/fileuploader/

その強力なファイルアップロードプラグインは、他のプラグインと比較してセットアップが非常に簡単で、現在はhtml5 apiをサポートしています。

4
John Laniba