HTMLInputElement: select-Ereignis

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.

Vollständige Kompatibilität anzeigen
Mehr erfahren

Das select-Ereignis der Schnittstelle HTMLInputElement wird ausgelöst, wenn sich der Umfang oder die Richtung der Auswahl programmgesteuert ändert oder wenn die Benutzerin oder der Benutzer Text auswählt.

Dieses Ereignis wird nicht ausgelöst, wenn nichts ausgewählt ist und die Benutzerin oder der Benutzer die Einfügemarke verschiebt. In diesem Fall wird nur das selectionchange-Ereignis ausgelöst.

Syntax

Verwenden Sie den Ereignisnamen in addEventListener():

addEventListener("select", (event) => { })

Alternativ können Sie ihn der Event-Handler-Eigenschaft der Schnittstelle zuweisen:

onselect = (event) => { }

Ereignistyp

Ein generisches Event.

Beispiele

Auswahl protokollieren

html

<input value="Try selecting some text in this element." />
<p id="log"></p>

function logSelection(event) {
  const log = document.getElementById("log");
  const selection = event.target.value.substring(
    event.target.selectionStart,
    event.target.selectionEnd,
  );
  log.textContent = `You selected: ${selection}`;
}

const input = document.querySelector("input");
input.addEventListener("select", logSelection);

Die Event-Handler-Eigenschaft `onselect` verwenden

Sie können den Event-Handler auch über die Eigenschaft onselect einrichten. Beachten Sie jedoch, dass dadurch gegebenenfalls andere Event-Listener ersetzt werden, die über onselect hinzugefügt wurden: