wie kann ich Eingang direkt auf TextArea-

Question

Ich sende

bin mit

https://github.com/Rovak/InlineAttachment 

Ich habe es zur Zeit alle Setup so kann ich per Drag & Drop Bilder auf meine TextArea- und sie laden gerade Imgur, aus folgenden dieses Tutorial:

http://wilfreddenton.com/posts/drag-and-drop-photo-uploads-to-imgur 

was ich versuche, eine Eingabe zu tun ist hinzuzufügen, so dass, wenn der Benutzer tut per Drag & Drop wollen, können sie einfach ihren PC durchsuchen und Dateien hochladen, und haben sie direkt in das Textfeld nach der Auswahl gehen. (wie github Kommentare funktionieren)

Ich kann nicht scheinen, um die Eingabe zu erhalten, um in das Textfeld einzufügen.

Hier ist ein anschauliches Beispiel: http://codepen.io/DrCustUmz/pen/KzZOeP

oder wenn Ihr in Github angemeldet sind, können Sie das Endziel sehen, was im versucht zu tun: https://github.com/wilfreddenton/dynamic-scss/issues/new

einreichen Dont tatsächlich aber klicken Sie unter dem Text „sie die Auswahl von“, pic ein paar Bilder, und sehen Sie sich das Textfeld an, nachdem Sie auf Öffnen geklickt haben.

Die Eingabeauswahl funktioniert in diesem Beispiel nicht. Wie kann ich es bekommen, also öffne ich die Choose-Dateien, wähle ein paar Bilder aus, und wenn ich "Öffnen" im Popup-Fenster "Browse my PC" wähle, werden sie direkt in das Textfeld eingefügt, genauso wie ich sie ziehe und ablege.

Answer 1

Die meisten Schreibarbeiten werden im Hintergrund ausgeführt, so dass ich das Schreiben in Textarea umschreiben musste. Tut mir leid, dass ich meistens reines Javascript verwende, also habe ich keine ausgefallenen jquery Funktionen benutzt.

Hier passiert die Magie. Der Upload kann jeweils nur eine Datei verarbeiten, daher musste ich für alle Dateien eine Schleife verwenden. Ich empfehle Ihnen, sich den gesamten Code anzusehen.

document.getElementById("inputFile").addEventListener("change", function() { 
    var object = this; 
    var editor = document.getElementById("editor"); 
    for(var i=0;i<this.files.length;i++) { 
    editor.value += "uploading..."; 
    uploadHandler.customUploadHandler(this.files[i], function(result) { 
     editor.value = editor.value.replace("uploading...",result.filename); 
    }); 
    } 
}); 

Whole code on CodePen

Answer 2

Sie können einfach die eventlistener auf Datei anhängen wird über wählen Dateien Option ausgewählt. Sie müssen nur den Upload im Callback auslösen. Angenommen, Sie ID der Eingabetyp-Datei als „Fileupload“

document.getElementById('fileUpload').addEventListener('change', function() { 
       console.log(this.files); 
       /*trigger the upload here, like you're doing in drag and drop*/ 
      });