Baseline Widely available
The HTMLInputElement.setRangeText()
method replaces a range of text in an <input>
or <textarea>
element with a new string.
setRangeText(replacement)
setRangeText(replacement, start)
setRangeText(replacement, start, end)
setRangeText(replacement, start, end, selectMode)
Parameters
replacement
The string to insert.
start
Optional
The 0-based index of the first character to replace. Defaults to the current selectionStart
value (the start of the user's current selection).
end
Optional
The 0-based index of the character after the last character to replace. Defaults to the current selectionEnd
value (the end of the user's current selection).
selectMode
Optional
A string defining how the selection should be set after the text has been replaced. Possible values:
"select"
selects the newly inserted text."start"
moves the selection to just before the inserted text."end"
moves the selection to just after the inserted text."preserve"
attempts to preserve the selection. This is the default.None (undefined
).
Click the button in this example to replace part of the text in the text box. The newly inserted text will be highlighted (selected) afterwards.
HTML<input
type="text"
id="text-box"
size="30"
value="This text has NOT been updated." />
<button>Update text</button>
JavaScript
function selectText() {
const input = document.getElementById("text-box");
input.focus();
input.setRangeText("ALREADY", 14, 17, "select");
}
document.querySelector("button").addEventListener("click", selectText);
Result Specifications Browser compatibility See also
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4