设置光标位置和div的编辑属性

555 阅读1分钟
  const setCaretPosition = (el: any) => { //设置在处罚的时候光标在最后一位
    el.focus();
    const range = document.createRange();
    range.selectNodeContents(el);
    range.collapse(false);
    const sel = window.getSelection();
    //判断光标位置,如不需要可删除
    if (sel.anchorOffset != 0) {
      return;
    }
    sel.removeAllRanges();
    sel.addRange(range);
  };
<div
    className={style.editInput}
    suppressContentEditableWarning={true}  //div可编辑属性
    contentEditable='true' //div可编辑属性
    onClick={(e) => {
      e.stopPropagation(); //阻止事件冒泡即可
    }}
    onInput={(e) => {
      setCaretPosition(
          document.querySelectorAll('.editInput')[key]
      );
    }}
                    
 >
     111
 </div>