jQuery获取textarea cursor / caret X，Y位置并在下面显示DIV

我正在尝试在Gmail / Google Docs richtext WYSIWYG edtior中实现类似“更改/删除链接”之类的内容，当您键入URL时，div下方会显示“Goto Link，Change，Remote”

我怎么能用jQuery写这样的东西？

1. 如何获取游标的行和列？
2. 如何计算字体宽度和高度（特别是非固定宽度字体，带有一些粗体/斜体样式）
3. 如何确保DIV出现在单词的开头？

先感谢您！

Answer 1

答案： http ： //jsfiddle.net/morrison/57BR3/

它能做什么：

• 创建位于超链接附近的div。
• 看起来像Google文档框。
• 能够更改文本和url。
• 删除已实施。

它没有做什么：

• 在textarea工作。 Textareas不支持html，因为它们是纯文本。 这是一个复杂的解决方法。 找一个图书馆，然后实现我的答案。
• 当光标被箭头键移动到光标上时打开。 由于上述项目不起作用。

Answer 2

你建议你正在建立一个WYSIWYG编辑器。 你确定要使用textarea吗？ Textareas不支持HTML。 要回答您之后的评论 ，在文本区域中获取插入符号（x，y）位置的最佳方法是使用textarea-caret-position插件 。