HTMLInputElement: selectionStart 属性

selectionStart 属性是 HTMLInputElement 接口的一个数字，表示所选文本的起始索引。当没有选择任何内容时，它将返回 <input> 元素内部文本输入光标（插入符号）的位置。

注意： 根据 WHATWG 表单规范，selectionStart 属性仅适用于类型为 text、search、URL、tel 和 password 的输入。在现代浏览器中，在其他输入类型上设置 selectionStart 属性会导致抛出异常。此外，在非文本输入元素上访问 selectionStart 属性时，此属性将返回 null。

如果 selectionStart 大于 selectionEnd，则两者都将被视为 selectionEnd 的值。

值

非负数。

示例

HTML

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

js
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

浏览器兼容性

BCD 表格仅在启用 JavaScript 的浏览器中加载。

另请参阅