Javascript Zugriff auf file-tag

[Gilles]

Hallo Leute,
Ich habe bei jira gesehen, dass es inzwischen möglich ist Dateien per drag & drop hochzuladen. Ein Beispiel Script dafür (was nur mit Firefox funktioniert) fand ich hier:
The File API has changed | The CSS Ninja - All things CSS, Javascript & xhtml
Nun habe ich mich gefragt, ob es nicht möglich ist auf den Inhalt von einem file-tag zuzugreifen. Ich würde gerne ein Bild ohne Iframe base64 kodiert per Ajax an den Server senden.
Weiß jemand, ob das möglich ist?
Oder ob die Drag&Drop Geschichte auch für Webkit Browser möglich ist?

 

[struppi]

Nun habe ich mich gefragt, ob es nicht möglich ist auf den Inhalt von einem file-tag zuzugreifen.

Nein, das ist nicht möglich.

 

[omoxen]

hi, ja ich glaub das ist inzwischen möglich, ich weiß zwar nicht wie, aber da´s interessant ist, werd ich mich mal erkundigen.
Als Alternative könntest du die dateien auf dem Clientcomputer mit java auslesen, und schreiben.

 

[crash]

Hier ein Artikel von sheppy darüber: https://developer.mozilla.org/en/Using_files_from_web_applications

 

[Gilles]

Hier ein Artikel von sheppy darüber: https://developer.mozilla.org/en/Using_files_from_web_applications

Vielen Dank. Das hat mir wirklich sehr weiter geholfen :)
Habe es nun hinbekommen die Daten aus den Bilder zu extrahieren. Hier eine Rohversion, die in Firefox und in Chrome funktioniert hat. Nehme an es funktioniert dann auch in den anderen Webkit-Browsern.
Hoffe der IE9 kann das auch schon in der Vollversion :) Wäre auf jeden Fall eine schöne Sache

window.onload = function() {
				document.getElementById("myFile").onchange = function() {
					// Bei change alle Files auslesen
					for(var i=0; i < this.files.length; i++ ) {
						// Einzelne File einlesen
						var file = this.files[i];
						var reader = new FileReader();
	          // Wenn das auslesen fertig ist, soll das Ergebnis ausgegeben werden
						reader.onloadend = function() {
							alert(this.result);
						}
						// Als Data-URL auslesen
						reader.readAsDataURL(file);
					}
				};
			};

Das input-Feld des Types File hatte bei mir die Id "myFile"