Gibt es ein gutes Plugin zum Hochladen von jQuery-Dateien per Drag & Drop? [geschlossen]


174

Gibt es ein ordentliches jQuery-Plugin, mit dem Sie ein einzelnes JS-Skript einfügen und dann mit einem einfachen Snippet ein Formular aktivieren können? Etwas wie das:

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

Das Upload-Ziel ist die Aktion des Formulars.

Jede Lösung darf nicht verhindern, dass ein reguläres Dateifeld verwendet werden kann (unter Verwendung der herkömmlichen Suchmethode).

Ich brauche immer nur eine Datei, obwohl es natürlich keine schlechte Sache ist, die Option für mehrere zu haben.

Ich habe einige Beispiele für Drag-Drop-Uploads gefunden:
http://www.appelsiini.net/2009/10/drag-and-drop-file-upload-with-google-gears http: //www.appelsiini. net / 2009/10 / html5-Drag-and-Drop-Upload mehrerer Dateien

Aber der Code dort ist nicht als Plugin eingerichtet. Es ist wahrscheinlich nicht allzu schwierig, dies zu ändern, aber es macht auch keinen Sinn, dies zu tun, wenn jemand anderes diese Arbeit bereits erledigt hat und einfach meinen Google-Suchanfragen ausweicht.

Ich suche idealerweise eine reine HTML5 / jQuery-Lösung.
Eine Google Gears-Lösung ist akzeptabel, eine Flash-Lösung jedoch nicht.


3
Diese Lösung funktioniert nur in der Bleeding Edge-Version von Firefox. Es gibt derzeit keine Unterstützung außerhalb von Firefox 3.6. Da dies der Fall ist, ist es unwahrscheinlich, dass Sie ein jQuery-Plugin dafür finden, und Sie müssten es höchstwahrscheinlich selbst erstellen.
Jojo

1
Bah. Die Alpha-Version ist seit ein paar Monaten erhältlich, das sollte lang genug sein. : / Ich denke, ich werde das Plugin dann selbst erstellen. Beantwortet die Frage, sobald ich fertig bin.
Peter Boughton

@ PeterBoughton Wenn Sie dieses Plugin noch nicht fertiggestellt haben, möchten Sie möglicherweise eine Antwort akzeptieren
Basic

Vielen Dank für die schnelle Basic. Ich habe das seit Ewigkeiten nicht mehr angeschaut, aber es scheint einen klaren Favoriten zu geben (und auf den ersten Blick scheint es anständig zu sein), also werde ich diesen akzeptieren.
Peter Boughton

Einen schnellen, außergewöhnlich unterstützten und funktionsreichen JavaScript-Uploader ohne Abhängigkeiten finden Sie unter Fine Uploader , früher bekannt als valums / file-uploader.
Ray Nicholus

Antworten:


134

Schauen Sie sich diese an: http://aquantum-demo.appspot.com/file-upload

Es behandelt auch das Hochladen mehrerer Dateien!


7
Gerade getestet. Es ist sehr schön für Chrome und Firefox. Verschlechtert sich auf den normalen Upload-Button unter IE. (aber deshalb ist es blitzfrei ...)
Frank Nocke

2
Ich suche auch nach einem Plugin zum Hochladen von Dateien. Dieses funktioniert jetzt nicht - 2015 (vielleicht hat es 2011 funktioniert). Kennt jemand ein funktionierendes Plugin zum Hochladen von Dateien?
Eran Meir

30

Überprüfen Sie die vor kurzem aus 1 freigegeben Upload - Handler von den Jungs, die den TinyMCE Editor erstellt. Es hat ein jQuery-Widget und sieht aus wie es eine Reihe von Funktionen und Fallbacks hat.

http://www.plupload.com/


Ich würde empfehlen, plupload zu verwenden, da es andere Technologien für die beste Benutzererfahrung nutzt.
Rickyduck

Die all_runtime funktioniert nicht für mich in Chrome 15, was der Punkt sein sollte, versuchen Sie es selbst: plupload.com/example_all_runtimes.php
Erik Johansson

1
Es ist nicht kostenlos für den kommerziellen Gebrauch (verwendet GPL für die kostenlose Version)
Sachin Joseph


15

Wenn Sie noch nach einem suchen, habe ich gerade meinen veröffentlicht: http://github.com/weixiyen/jquery-filedrop

Funktioniert derzeit für Firefox 3.6. Ich habe mich entschlossen, den Chrome-Hack vorerst nicht durchzuführen und Webkit in den nächsten Versionen von Safari und Chrome FileReader () einholen zu lassen.

Dieses Plugin ist zukunftskompatibel.

FileReader () ist der offizielle Standard für etwas wie XHR.getAsBinary (), das laut Mozilla veraltet ist.

Es ist auch das einzige mir bekannte HTML5-Desktop-Drag & Drop-Plugin, mit dem Sie zusätzliche Daten zusammen mit der Datei senden können, einschließlich Daten, die zum Zeitpunkt des Uploads mit einer Rückruffunktion berechnet werden können.


1
Die Dokumentation ist etwas dünn (auch jetzt noch im Jahr 2013), aber sie funktioniert anständig gut.
Dansan

1
Aber keine Demo?! was ist damit.
Sagive SEO

15

Wenn Sie nach einem suchen, der nicht auf Flash basiert, ist dropzonejs ein guter Ruf. Es unterstützt mehrere Dateien und Drag & Drop.

http://www.dropzonejs.com/


Ihre ursprüngliche Empfehlung wurde im März auf github.com/Widen/fine-uploader verschoben .
Ray Nicholus

Dank dafür. Sieht so aus, als wäre es jetzt ein kostenpflichtiges Angebot (für den kommerziellen Gebrauch).
Ross Gledhill

Das ist richtig. Wir können nicht das Maß an Support und Entwicklungsgeschwindigkeit anbieten, das wir kostenlos anbieten.
Ray Nicholus

Hier ist ein nettes Tutorial zum Hochladen von Drag & Drop-Bildern mit dropzonejs goo.gl/FVdkS0
Satinder singh

Nicht einfach in vorhandene Form zu integrieren. Deshalb habe ich mich entschieden, mich von Dropzone zu entfernen.
Usman Khalid


8

Schamloser Stecker:

Filepicker.io übernimmt das Hochladen für Sie und gibt eine URL zurück. Es unterstützt Drag & Drop, Cross-Browser. Außerdem können Benutzer von Dropbox / Facebook / Gmail hochladen, was auf einem mobilen Gerät sehr praktisch ist.


4

Wie wäre es mit der neuesten Version von jQuery Fileuploader: http://pixelcone.com/fileuploader/

Es ist ein leistungsstarkes Plugin zum Hochladen von Dateien, das im Vergleich zu anderen Plugins sehr einfach einzurichten ist und jetzt die HTML5-API unterstützt.


1
Unter welchen Lizenzen ist jQuery Fileuploader verfügbar? Sie sollten dies sowohl auf Ihrer Website als auch im Quellcode Ihres Plugins klarstellen, denke ich. :)
OpaCitiZen

Defekter Link, ist dieser korrekt?
Puce
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.