Heim >Web-Frontend >js-Tutorial >Wie kann ich die Dateigröße vor dem Hochladen mit JavaScript überprüfen?

Wie kann ich die Dateigröße vor dem Hochladen mit JavaScript überprüfen?

Mary-Kate Olsen
Mary-Kate OlsenOriginal
2024-12-15 20:56:16735Durchsuche

How Can I Verify File Size Before Uploading with JavaScript?

Überprüfen der Dateigröße vor dem Hochladen mit JavaScript

Beim Hochladen von Dateien ist es wichtig sicherzustellen, dass die Dateigröße bestimmte Einschränkungen erfüllt. JavaScript bietet hierfür mit der Datei-API eine elegante Lösung.

Lösung:

Um die Dateigröße vor dem Hochladen zu überprüfen, verwenden Sie den folgenden Code:

// Setup event listener for 'Load' button click
document.getElementById("btnLoad").addEventListener("click", function () {
  // Verify browser support for FileReader
  if (!window.FileReader) {
    console.log("File API not supported.");
    return;
  }

  // Retrieve the file from the file input
  var input = document.getElementById("fileinput");
  var file = input.files[0];

  // Validate file size
  if (!file) {
    console.log("No file selected.");
  } else {
    console.log("File " + file.name + " is " + file.size + " bytes in size.");
  }
});

Erklärung:

  • Dieser Code verwendet die FileReader-API zum Lesen der Datei und bestimmen Sie ihre Größe in Bytes.
  • Die Validierung erfolgt im Ereignis-Listener, der an die Schaltfläche „Laden“ angehängt ist.
  • Wenn eine Datei erfolgreich abgerufen wurde und die Größenbeschränkungen erfüllt, wird der Dateiname angezeigt und Größe werden in der Konsole angezeigt.
  • Wenn keine Datei ausgewählt ist oder der Browser die Datei-API nicht unterstützt, werden entsprechende Meldungen angezeigt.

Das obige ist der detaillierte Inhalt vonWie kann ich die Dateigröße vor dem Hochladen mit JavaScript überprüfen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn