HTMLInputElement: метод setSelectionRange()

Базовая линия Широко доступна

Эта функция хорошо зарекомендовала себя и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с июля 2015 года.

Метод HTMLInputElement.setSelectionRange() устанавливает начальные и конечные позиции текущего выделенного текста в элементе <input> или <textarea>.

Элемент должен быть сфокусирован, чтобы вызов имел эффект.

Необязательно, можно указать направление, в котором следует рассматривать выбор. Это позволяет, например, указать, что выбор был сделан пользователем, щелкнувшим и перетащившим от конца выделенного текста к началу.

Этот метод обновляет свойства HTMLInputElement.selectionStart, HTMLInputElement.selectionEnd и HTMLInputElement.selectionDirection в одном вызове.

Элемент должен иметь один из следующих типов ввода: password, search, tel, text или url. В противном случае браузер выбросит исключение InvalidStateError.

Если вы хотите выделить весь текст элемента ввода, можно использовать метод HTMLInputElement.select() вместо этого.

Синтаксис

setSelectionRange(selectionStart, selectionEnd)
setSelectionRange(selectionStart, selectionEnd, selectionDirection)

Параметры

selectionStart

Индекс с нуля первого выделенного символа. Индекс, больший, чем длина значения элемента, интерпретируется как указывающий на конец значения.

selectionEnd

Индекс с нуля символа после последнего выделенного символа. Индекс, больший, чем длина значения элемента, интерпретируется как указывающий на конец значения. Если selectionEnd меньше selectionStart, оба значения интерпретируются как значение selectionEnd.

selectionDirection Необязательно

Строка, указывающая направление, в котором считается выполненным выделение. Возможные значения:

"forward"
"backward"
"none" если направление неизвестно или не имеет значения. Значение по умолчанию.

Возвращаемое значение

Ничего (undefined).

Исключения

InvalidStateError DOMException: Выбрасывается, если элемент не имеет одного из следующих типов ввода: password, search, tel, text или url.

Примеры

Нажмите кнопку в этом примере, чтобы выделить третьи, четвертые и пятые символы в текстовом поле ("zil" в слове "Mozilla").

HTML

<input type="text" id="text-box" size="20" value="Mozilla" />
<button onclick="selectText()">Select text</button>

JavaScript

function selectText() {
  const input = document.getElementById("text-box");
  input.focus();
  input.setSelectionRange(2, 5);
}

Результат

Спецификации

Спецификация
HTML # dom-textarea/input-setselectionrange-dev

Совместимость с браузерами

	Рабочие столы					Мобильные
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari на iOS	Samsung Internet	WebView Android
`setSelectionRange`	1	12	1	8	3	18	4	10.1	1	1.0	4.4

См. также

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange