将文本插入到文本区域的光标位置

关于更多公共类的操作方法,可以关注下小滑轮网站

/**
 * 将文本插入到文本区域的光标位置
 * _应用场景:_如在评论框里,在光标位置里插入emoji等
 * @param {object} dom对象
 * @param {string} str
 * @example
 * <textarea name="textarea" rows="10" cols="50">你好世界~</textarea>
 * const editText = document.querySelector('#editText');
 * insertText(editText, 'hello world');
 * // =>
 */
function insertAtCaret(dom, str = '') {
  if (document.selection) { // IE
    let sel = document.selection.createRange();
    sel.text = str;
  } else if (typeof dom.selectionStart === 'number' && typeof dom.selectionEnd === 'number') {
    let startPos = dom.selectionStart;
    let endPos = dom.selectionEnd;
    let cursorPos = startPos;
    let tmpStr = dom.value;

    dom.value = tmpStr.substring(0, startPos) + str + tmpStr.substring(endPos, tmpStr.length);
    cursorPos += str.length;
    dom.selectionStart = dom.selectionEnd = cursorPos;
  } else {
    dom.value += str;
  }
}

philips
719 声望177 粉丝

前端程序员