Javascript 我能找到光标吗'；内容编辑器中的像素位置？

我的意思是找到光标的上/左像素位置，而不是字符偏移量

我之所以要这样做，是因为我想在光标旁边显示一个小的工具提示，如div（想想较新的MS Word的浮动格式框），当您键入或单击光标时，它会跟随光标。如果用户单击，我可以使用鼠标坐标，但不确定如何进行键入

有可靠的方法吗？如果不用于查找光标的顶部/左侧位置，则另一种方法是仅查找该行的顶部位置

---

示例代码不是100%必需的，只要方法有效并且解释得很好。

这不是真正的答案，而是需要考虑的概念：

在contenteditable中，所有内容都由节点组成，就像其他HTML一样，因此您可以获取节点的位置，问题是您在节点中的位置（如果是文本，则节点中可能有100个字符）。因此，您必须创建自己的单字符节点

要获得某人键入的位置，您必须捕获onkeypress事件，停止传播气泡，获取他们要求的角色，将其填充到节点（可能是一个“标记”）中，然后插入该节点。然后通过偏移量计算该跨距/节点的确切位置

您可能必须删除span，然后仅用字符替换它

还有一个我遇到的问题是，如果在滚动时弄乱了气泡事件，插入符号可能会超出视口

或者，这可能是一个稍微好一点的主意，与其干扰传播，不如允许浏览器自己插入字符，然后在之前或之后立即在span/节点中插入零宽度unicode字符（不可见），并计算其位置。然后在飞行中或暂停打字时拉出标记

是的，很乱，对不起。如果有人有更好的方法，我洗耳恭听。

试试这个

var cursorY = window.getSelection().getRangeAt(0).getBoundingClientRect().top;

cursorY是光标在窗口中的Y位置

对象表示用户选择的文本范围 用户或插入符号的当前位置

返回表示以下对象之一的范围对象： 当前选定的范围

---

当你说游标是指鼠标光标或输入位置（可能在这个词的中间）。如果你是指鼠标，那么你就可以绑定鼠标事件，然后抓取鼠标位置。@布莱尔，我指的是输入位置，是的，它可能在一个词的中间。