Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.
DataTransfer: files-Eigenschaft
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.
Die schreibgeschützte files-Eigenschaft von DataTransfer-Objekten ist eine Liste der Dateien in der Drag-Operation. Wenn die Operation keine Dateien umfasst, ist die Liste leer.
Diese Funktion kann verwendet werden, um Dateien vom Desktop eines Benutzers in den Browser zu ziehen.
Hinweis:
Die files-Eigenschaft von DataTransfer-Objekten kann nur innerhalb der drop- und paste-Ereignisse zugegriffen werden. Für alle anderen Ereignisse wird die files-Eigenschaft leer sein, da ihr zugrunde liegendes Datenlager sich im geschützten Modus befindet.
Wert
Ein FileList der Dateien in einer Drag-Operation, ein Listenelement für jede Datei in der Operation. Hatte die Drag-Operation keine Dateien, ist die Liste leer.
Beispiele
Lesen der Dateienliste
Dieses Beispiel erstellt einen einfachen Bereich, in den Sie Dateien ziehen können, und zeigt einige Metadaten an.
<pre id="output">Drop files here from your file system.</pre>
#output {
min-height: 200px;
border: 1px solid black;
padding: 1em;
}
const output = document.getElementById("output");
function log(text) {
output.innerText += text;
}
output.addEventListener("dragenter", (e) => {
e.stopPropagation();
e.preventDefault();
output.textContent = "";
});
output.addEventListener("dragover", (e) => {
e.stopPropagation();
e.preventDefault();
});
output.addEventListener("drop", (e) => {
e.stopPropagation();
e.preventDefault();
const files = event.dataTransfer.files;
log(`File Count: ${files.length}\n`);
for (const file of files) {
log(` File: ${file}, ${file.name}, ${file.size} bytes\n`);
}
});
Spezifikationen
| Spezifikation |
|---|
| HTML # dom-datatransfer-files-dev |
Browser-Kompatibilität
JavaScript aktivieren, um diese Browser-Kompatibilitätstabelle anzuzeigen.