JavaScript
请问，如何用JavaScript获取div中插入符光标的像素位置？
墨衍会员 · AI 创作全网分发 墨衍智能分发 通过墨衍一键同步至各平台 可同步平台 CSDN微信公众号微博知乎掘金百家号博客园抖音小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年，写一次发全网
我也要 关注 + 加入社区 如题，我想要完成的是在可编辑div中实现类似微博@的功能，需要获取插入光标的像素位置。div是可编辑的，width和height可变，输入的字符不限格式，并且可输入的字符数量庞大。
ps：热心的亲们，我们常见的@功能都是在textarea和input中实现的，它们的方法对于div来说不太适用。
pps：不是鼠标位置，不是div元素的位置，是当焦点在div时，div里面一闪一闪的那个插入符光标的像素位置，有x,y的那种，或者 {left = p.left + "px"; top = p.top +"px"; }的那种(* ￣︿￣)
拜谢
ps：热心的亲们，我们常见的@功能都是在textarea和input中实现的，它们的方法对于div来说不太适用。
pps：不是鼠标位置，不是div元素的位置，是当焦点在div时，div里面一闪一闪的那个插入符光标的像素位置，有x,y的那种，或者 {left = p.left + "px"; top = p.top +"px"; }的那种(* ￣︿￣)
拜谢
...全文
相关推荐
JS在可编辑的div中的光标位置插入内容的方法
获取光标位置： - 使用原生JS获取光标位置时，需要用到window.getSelection()方法来获取当前选中的文本范围（Range对象），然后通过range.startOffset属性可以得知光标位置在选中的文本范围中的偏移量
vue项目中在可编辑div光标位置插入内容的实现代码
该资源主要讨论的是在Vue项目中如何在可编辑的div元素中实现光标位置插入内容的功能。示例代码展示了如何利用HTML、CSS和JavaScript与Vue结合来处理这个问题。在Vue项目中，可编
DIV可编辑模式在光标位置插入内容
关于在光标位置插入内容，JavaScript提供了获取和操作光标位置的方法。
JS获取文本框焦点光标位置、选中起始位置、终止位置、选择内容
在提供的HTML文件"JS获取文本框光标位置、选中起始位置、终止位置、选择内容.html"中，应该包含了一个示例，演示了如何使用这些方法来实时显示选中区域的信息。
纯 JavaScript 手写拖拽系统：绕过 draggable 属性的高可控实现
拖拽交互是 Web 管理后台、看板系统和可视化编辑器的核心能力，其本质是基于鼠标或触摸事件的状态机建模——通过 mousedown/touchstart 捕获起始位置，mousemove/touchmove 实时计算偏移，mouseup/touchend 完成位置固化。相比 HTML5 原生 draggable 属性，手写方案规避了文本选中劫持、滚动失效、坐标失准等硬伤，同时天然支持 transform 定位、网格吸附、边界限制与跨端一致性。它不依赖 DragEvent 事件流和 dataTransfer
