wake-up-neo.net

Wie setze ich einen Wert für eine Dateieingabe in HTML?

Hinweis:

Die Antworten und Kommentare unten spiegeln den Stand der älteren Browser in 2009 wider. Jetzt können Sie den Wert des Dateieingabeelements mithilfe von JavaScript und eines dataTransfer- oder FileList-Objekts in 2017 dynamisch/programmgesteuert festlegen.

Siehe die Antwort in dieser Frage für Details sowie eine Demo:
Wie programmiere ich den Dateieingabewert (d. H .: beim Drag-Drop von Dateien)?

Wie kann ich den Wert einstellen?

<input type="file" />
268
Alon Gubkin

Sie können dies aus Sicherheitsgründen nicht tun.

Vorstellen:

<form name="foo" method="post" enctype="multipart/form-data">
    <input type="file" value="c:/passwords.txt">
</form>
<script>document.foo.submit();</script>

Sie möchten nicht, dass die von Ihnen besuchten Websites dies tun können, oder? =)

447
BalusC

Du kannst nicht.

Die einzige Möglichkeit, den Wert einer Dateieingabe festzulegen, besteht darin, dass der Benutzer eine Datei auswählt.

Dies geschieht aus Sicherheitsgründen. Andernfalls können Sie ein Javascript erstellen, das automatisch eine bestimmte Datei vom Clientcomputer hochlädt.

114
Guffa

Keine Antwort auf Ihre Frage (die andere beantwortet haben), aber wenn Sie einige Bearbeitungsfunktionen für ein hochgeladenes Dateifeld haben möchten, möchten Sie wahrscheinlich Folgendes tun:

  • zeigen Sie den aktuellen Wert dieses Feldes an, indem Sie einfach den Dateinamen oder die URL drucken, einen Link zum Herunterladen anklicken oder wenn es sich um ein Bild handelt: Zeigen Sie es einfach an, möglicherweise als Miniaturbild
  • das <input>-Tag, um eine neue Datei hochzuladen
  • ein Kontrollkästchen, das bei Aktivierung die aktuell hochgeladene Datei löscht. Beachten Sie, dass es keine Möglichkeit gibt, eine "leere" Datei hochzuladen. Sie benötigen etwas Ähnliches, um den Wert des Felds zu löschen
47
Wim

Du kannst nicht Und es ist eine Sicherheitsmaßnahme. Stellen Sie sich vor, wenn jemand eine JS schreibt, die den Dateieingabewert in eine sensible Datendatei setzt?

32
Eimantas

Wie alle anderen hier festgestellt haben: Sie können eine Datei nicht automatisch mit JavaScript hochladen.

JEDOCH! Wenn Sie Zugriff auf die Informationen haben, die Sie in Ihrem Code senden möchten (d. H. Nicht passwords.txt), können Sie sie als blob -Typ hochladen und dann als Datei behandeln.

Was der Server am Ende sehen wird, ist nicht zu unterscheiden von jemandem, der tatsächlich den Wert von <input type="file" /> setzt. Der Trick besteht letztlich darin, ein neues XMLHttpRequest () mit dem Server zu beginnen ...

function uploadFile (data) {
        // define data and connections
    var blob = new Blob([JSON.stringify(data)]);
    var url = URL.createObjectURL(blob);
    var xhr = new XMLHttpRequest();
    xhr.open('POST', 'myForm.php', true);

        // define new form
    var formData = new FormData();
    formData.append('someUploadIdentifier', blob, 'someFileName.json');

        // action after uploading happens
    xhr.onload = function(e) {
        console.log("File uploading completed!");
    };

        // do the uploading
    console.log("File uploading started!");
    xhr.send(formData);
}

    // This data/text below is local to the JS script, so we are allowed to send it!
uploadFile({'hello!':'how are you?'});
0
HoldOffHunger

1) Das Problem des Standardwerts in einer Dateieingabe IS ist NICHT "aus Sicherheitsgründen erledigt", aber die Browser "haben es nur aus gutem Grund nicht implementiert": siehe tiefer Bericht

2) Eine einfache Lösung kann sein, eine Texteingabe über der Dateieingabe zu verwenden, wie hier . Natürlich benötigen Sie etwas Code zum Versenden der Datei. Verwenden Sie jetzt den Wert in der Texteingabe und nicht die Dateieingabe.

In meinem Fall ist das Verwenden der HTA-Anwendung kein Problem, ich verwende kein Formular.

Bester Respekt

0
msillano