HTMLInputElement：selectionEnd 属性

selectionEnd 是 HTMLInputElement 接口的一个数字属性，表示所选文本的结束索引。当没有选择时，它返回当前文本输入光标位置后紧邻字符的偏移量。

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

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

值

一个非负数。

示例

HTML

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

<!-- using selectionEnd on text input element -->
<fieldset>
  <legend>selectionEnd property on type=text</legend>
  <label for="pin">Input PIN</label>
  <input type="text" id="pin" value="impossible PIN: 102-12-145" />
  <button id="pin-btn" type="button">PIN correction</button>
</fieldset>

JavaScript

js
const colorEnd = document.getElementById("color");
const text = document.querySelector("#pin");
const pinBtn = document.querySelector("#pin-btn");
const validPinChecker = /[^\d{3}-\d{2}-\d{3}]/g;
const selectionEnd = text.value.length;
const selectedText = text.value.substring(text.selectionStart, selectionEnd);

pinBtn.addEventListener("click", () => {
  const correctedText = selectedText.replace(validPinChecker, "");
  text.value = correctedText;
});

// open browser console to verify output
console.log(colorEnd.selectionEnd); // Output : null

结果

规范

规范
HTML 标准
# dom-textarea/input-selectionend

浏览器兼容性

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

另请参阅