HTMLInputElement: Methode setSelectionRange()
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
Die HTMLInputElement.setSelectionRange()-Methode legt die Start- und Endpositionen der aktuellen Textauswahl in einem <input>- oder <textarea>-Element fest. Dies aktualisiert den Auswahlzustand sofort, obwohl die visuelle Hervorhebung nur erscheint, wenn das Element fokussiert ist.
Optional können Sie die Richtung angeben, in der die Auswahl als erfolgt betrachtet werden soll. Damit können Sie zum Beispiel angeben, dass die Auswahl vom Benutzer durch Klicken und Ziehen vom Ende des ausgewählten Textes zum Anfang durchgeführt wurde.
Diese Methode aktualisiert die Eigenschaften HTMLInputElement.selectionStart, HTMLInputElement.selectionEnd und HTMLInputElement.selectionDirection in einem Aufruf, unabhängig davon, ob das Element fokussiert ist. Die visuelle Hervorhebung der Auswahl wird nur angezeigt, wenn das Element den Fokus hat.
Das Element muss einen der folgenden Eingabetypen haben: password, search, tel, text oder url. Andernfalls wirft der Browser eine InvalidStateError-Ausnahme.
Wenn Sie alle Texte eines Eingabeelements auswählen möchten, können Sie stattdessen die Methode HTMLInputElement.select() verwenden.
Syntax
setSelectionRange(selectionStart, selectionEnd)
setSelectionRange(selectionStart, selectionEnd, selectionDirection)
Parameter
selectionStart-
Der 0-basierte Index des ersten ausgewählten Zeichens. Ein Index, der größer als die Länge des Werts des Elements ist, wird als Ende des Werts behandelt.
selectionEnd-
Der 0-basierte Index des Zeichens nach dem letzten ausgewählten Zeichen. Ein Index, der größer als die Länge des Werts des Elements ist, wird als Ende des Werts behandelt. Wenn
selectionEndkleiner alsselectionStartist, werden beide als der Wert vonselectionEndbehandelt. selectionDirectionOptional-
Ein String, der die Richtung angibt, in der die Auswahl als erfolgt betrachtet wird. Mögliche Werte:
"forward""backward""none", wenn die Richtung unbekannt oder nicht relevant ist. Standardwert.
Rückgabewert
Keiner (undefined).
Ausnahmen
Beispiele
Klicken Sie auf die Schaltfläche in diesem Beispiel, um das dritte, vierte und fünfte Zeichen im Textfeld auszuwählen ("zil" im Wort "Mozilla").
HTML
<input type="text" id="text-box" size="20" value="Mozilla" />
<button>Select text</button>
JavaScript
function selectText() {
const input = document.getElementById("text-box");
input.focus();
input.setSelectionRange(2, 5);
}
document.querySelector("button").addEventListener("click", selectText);
Ergebnis
Spezifikationen
| Specification |
|---|
| HTML # dom-textarea/input-setselectionrange-dev |
Browser-Kompatibilität
Loading…