HTMLInputElement: свойство selectionStart

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

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

Свойство selectionStart интерфейса HTMLInputElement представляет собой число, которое обозначает начальный индекс выделенного текста. Если ничего не выделено, оно возвращает позицию курсора ввода текста (caret) внутри элемента <input>.

Примечание: Согласно спецификации WHATWG forms, свойство selectionStart применяется только к элементам ввода типа text, search, URL, tel и password. В современных браузерах при попытке установить свойство selectionStart для других типов элементов ввода генерируется исключение. Кроме того, при обращении к свойству selectionStart для элементов ввода, не являющихся текстовыми, возвращается значение null.

Если значение selectionStart больше, чем selectionEnd, то оба значения обрабатываются как значение selectionEnd.

Значение

Неотрицательное число.

Примеры

HTML

<!-- use selectionStart on non text input element -->
<label for="color">selectionStart property on type=color</label>
<input id="color" type="color" />

<!-- use selectionStart on text input element -->
<fieldset>
  <legend>selectionStart property on type=text</legend>
  <label for="statement">Select 'mdn' word from the text : </label>
  <input
    type="text"
    id="statement"
    value="The mdn is a documentation repository." />
  <button id="statement-btn">Select mdn text</button>
</fieldset>

JavaScript

const inputElement = document.getElementById("statement");
const statementBtn = document.getElementById("statement-btn");
const colorStart = document.getElementById("color");

statementBtn.addEventListener("click", () => {
  inputElement.selectionStart = 4;
  inputElement.selectionEnd = 7;
  inputElement.focus();
});

// open browser console to verify output
console.log(colorStart.selectionStart); // Output : null

Результат

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

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

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

	Рабочие столы					Мобильные устройства
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari на IOS	Samsung Internet	WebView Android
`selectionStart`	1	12	1	≤12.1	1.3	18	4	≤12.1	1	1.0	4.4

См. также

HTMLTextAreaElement.selectionStart свойство
HTMLInputElement.selectionEnd свойство
HTMLInputElement.setSelectionRange метод

© 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/selectionStart