如何在文本框中获取插入符号的（x，y）像素坐标？
我正在使用jQuery，并试图find一个跨浏览器的方式来获取<textarea> s和input框中的插入符号的像素坐标，以便我可以放置一个绝对定位的div围绕此位置。
有没有一些jQuery插件？ 或JavaScript的片段来做到这一点？
我已经找了一个textarea插入符号meteor自动完成的插件，所以我已经评估了GitHub上的所有8个插件。 目前为止，胜利者是来自Component的 textarea-caret-position 。
特征
- 像素精度
- 没有任何依赖关系
- 浏览器兼容性：Chrome，Safari，Firefox（尽pipe它有两个 bug ），IE9 +; 可能工作，但没有在Opera，IE8或更旧的testing
- 支持任何字体系列和大小，以及文本转换
- 文本区域可以有任意的填充或边框
- 不会被textarea中的水平或垂直滚动条所困惑
- 支持硬返回，标签（IE除外）和文本中的连续空格
- 在比文本区域中的列更长的行上的正确位置
- 在包装长词时，在行尾没有“鬼”的位置
这是一个演示 – http://jsfiddle.net/dandv/aFPA7/
怎么运行的
镜像<div>是在屏幕外创build的，样式完全像<textarea> 。 然后，textarea的文本被复制到div中，并在它后面插入一个<span> 。 然后，span的文本内容被设置为textarea中文本的其余部分，以便忠实地再现人造div中的包装。
这是保证处理所有关于缠绕长线的边缘情况的唯一方法。 它也被GitHub用来确定@ user下拉的位置。
注意：这个答案描述了如何获得文本光标/脱字符的字符坐标 。 要find像素坐标，您需要进一步扩展。
首先要记住的是游标可以处于三种状态
- 一个常规的插入光标在特定的位置
- 一个文本select具有一定的有界区域
- 不活跃：textarea没有焦点。 尚未使用。
IE模型使用Object document.selection ，从这里我们可以得到一个TextRange对象，它使我们能够访问select，从而访问光标位置。
FF模型/ Opera使用便利的variables[input] .selectionStart和selectionEnd。
两种模型都将一个常规的光标指针表示为零宽度select，左边界是光标位置。
如果input字段没有焦点，您可能会发现没有设置。 我用下面的代码取得了很好的效果，在当前的光标位置插入一段文字，如果有的话也replace当前的select。 根据确切的浏览器，YMMV。
function insertAtCursor(myField, myValue) { /* selecion model - ie */ if (document.selection) { myField.focus(); sel = document.selection.createRange(); sel.text = myValue; } /* field.selectionstart/end firefox */ else if (myField.selectionStart || myField.selectionStart == '0' ) { var startPos = myField.selectionStart; var endPos = myField.selectionEnd; myField.value = myField.value.substring(0, startPos) + myValue + myField.value.substring(endPos, myField.value.length); myField.selectionStart = startPos + myValue.length; myField.selectionEnd = startPos + myValue.length; myField.focus(); } // cursor not active/present else { myField.value += myValue; }
错误提示：链接没有被正确标记在顶部。
select对象： http : //msdn.microsoft.com/en-us/library/ms535869(VS.85).aspx
TextRange对象： http : //msdn.microsoft.com/en-us/library/ms535872( VS.85) .aspx
我不认为这可以在每个浏览器中完成。 有人已经在IE6中完成了它，但在FF或Opera（AFAIK）中不起作用。 也许你可以在所有的浏览器中使用它。
这是一个从2005年开始的博客文章 。
