怎么获取鼠标光标位置_元素contenteditable属性为true时,鼠标光标位置的问题
时间: 2024-05-14 16:19:17 浏览: 168
Vue中div contenteditable 的光标定位方法
获取鼠标光标位置的方式与元素是否具有 `contenteditable` 属性无关,可以通过以下代码获取鼠标光标位置:
```javascript
function getCursorPos(element) {
let cursorPos = 0;
if (document.selection) {
// IE
element.focus();
const range = document.selection.createRange();
range.moveStart('character', -element.innerText.length);
cursorPos = range.text.length;
} else if (element.selectionStart || element.selectionStart === 0) {
cursorPos = element.selectionStart;
}
return cursorPos;
}
```
其中 `element` 是你要获取光标位置的 DOM 元素。如果是 `contenteditable` 元素,可以直接将其作为参数传入。
注意,如果光标位置在最后一个字符后面,`getCursorPos` 函数返回值应该等于 `element.innerText.length`。
阅读全文