HTMLInputElement: cancel event

Das cancel Ereignis wird auf einem <input> Element ausgelöst, wenn der Benutzer das Dateiauswahldialogfeld über die Esc-Taste oder die Abbrechen-Schaltfläche schließt und wenn der Benutzer dieselben Dateien erneut auswählt, die zuvor mit type="file" ausgewählt wurden.

Dieses Ereignis kann nicht abgebrochen werden, kann jedoch weitergegeben werden.

Syntax

Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder setzen Sie eine Ereignishandler-Eigenschaft.

js
addEventListener("cancel", (event) => {});

oncancel = (event) => {};

Ereignistyp

Ein generisches Event.

Beispiele

Abbrechen eines Eingabeelements

HTML

html
<label for="file">Select a file. Or don't.</label>
<input type="file" id="file" name="file" />

<div id="result"></div>

JavaScript

js
const elem = document.getElementById("file");

const result = document.getElementById("result");

elem.addEventListener("cancel", () => {
  result.textContent = "Canceled.";
});

elem.addEventListener("change", () => {
  if (elem.files.length == 1) {
    result.textContent = "File Selected.";
  }
});

Ergebnis

Öffnen Sie den Dateiauswahldialog und schließen Sie ihn dann mit der Escape-Taste oder der Abbrechen-Schaltfläche. Beide Aktionen lösen das Cancel-Ereignis aus. Versuchen Sie auch, eine lokale Datei auf Ihrem Computer auszuwählen; öffnen Sie dann das Dateiauswahlfenster erneut und wählen Sie dieselbe Datei erneut aus. Auch dies löst das Cancel-Ereignis aus.

Spezifikationen

Specification
HTML Standard
# event-cancel
HTML Standard
# handler-oncancel

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch