HTMLTextAreaElement: Methode setRangeText()
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Die Methode setRangeText()
der Schnittstelle HTMLTextAreaElement
ersetzt einen Textbereich in einem <textarea>
-Element mit dem als Argument übergebenen neuen Text.
Zusätzliche optionale Parameter umfassen den Beginn des zu ändernden Textabschnitts, das Ende des Abschnitts und ein Schlüsselwort, das bestimmt, welcher Teil des <textarea>
nach der Aktualisierung des Textes ausgewählt werden soll. Wenn die Argumente startSelection
und endSelection
nicht bereitgestellt werden, wird der Bereich als die Auswahl angenommen.
Das letzte Argument bestimmt, wie die Auswahl nach dem Ersetzen des Textes gesetzt wird. Die möglichen Werte sind "select"
, welches den neu eingefügten Text auswählt, "start"
, welches die Auswahl direkt vor den eingefügten Text bewegt, "end"
, welches die Auswahl direkt hinter den eingefügten Text bewegt, oder der Standardwert "preserve"
, welcher versucht, die Auswahl zu bewahren.
Zusätzlich werden die Ereignisse select
und selectchange
ausgelöst.
Syntax
setRangeText(replacement)
setRangeText(replacement, startSelection)
setRangeText(replacement, startSelection, endSelection)
setRangeText(replacement, startSelection, endSelection, selectMode)
Parameter
replacement
-
Der einzusetzende String.
selectionStart
Optional-
Der Index des ersten ausgewählten Zeichens. Ein Index, der größer ist als die Länge des Werts des Elements, wird als der Wert am Ende behandelt.
selectionEnd
Optional-
Der Index des Zeichens nach dem letzten ausgewählten Zeichen. Ein Index, der größer ist als die Länge des Werts des Elements, wird als der Wert am Ende behandelt. Wenn
selectionEnd
kleiner ist alsselectionStart
, werden beide als der Wert vonselectionEnd
behandelt. selectMode
Optional-
Ein Schlüsselwort, entweder
select
,start
,end
oder der Standardwertpreserve
, welches definiert, wie die Auswahl nach dem Ersetzen des Textes gesetzt werden soll.
Rückgabewert
Keiner (undefined
).
Beispiele
Klicken Sie auf die Schaltfläche in diesem Beispiel, um einen Teil des Textes im Textfeld zu ersetzen. Der neu eingefügte Text wird danach hervorgehoben (ausgewählt).
HTML
<label for="ta">Example text input:</label>
<textarea id="ta">
This text has NOT been updated.
</textarea>
<button id="btn">Update text</button>
JavaScript
const btn = document.getElementById("btn");
btn.addEventListener("click", () => {
changeText();
});
function changeText() {
const textarea = document.getElementById("text-box");
textarea.focus();
textarea.setRangeText("ALREADY", 14, 17, "select");
}
Ergebnis
Spezifikationen
Specification |
---|
HTML Standard # dom-textarea/input-setrangetext-dev |
Browser-Kompatibilität
BCD tables only load in the browser