在输入框的光标处插入内容

//在光标处插入文字   field为文本框的DOM元素,value要插入的字符
function insertText(field, value) {
  const startPos = field.selectionStart
  const endPos = field.selectionEnd
  // 保存光标所在处滚动高度
  const restoreTop = field.scrollTop
  field.value =
    field.value.substring(0, startPos) +
    value +
    field.value.substring(endPos, field.value.length)
  field.focus()
  // 让文本域卷动高度保持在光标所在处
  field.scrollTop = restoreTop
  field.selectionStart = startPos + value.length
  field.selectionEnd = startPos + value.length
}

示例

See the Pen by zhangfanhang on CodePen.

说明

HTMLTextAreaElement

• selectionStart返回/设置所选文本开头的索引。如果未选择文本，则返回光标后面的字符的索引。

• selectionEnd返回/设置所选文本结尾的索引。如果未选择文本，则返回光标后面的字符的索引。

未选择文本，两个属性的值相同