如何在文本框中获取插入符号的(x,y)像素坐标？
Pat*_*Pat 28 javascript jquery cross-browser
我正在使用jQuery并试图找到一种跨浏览器的方式来获取插入符号<textarea>和input盒子中的插入符号,这样我就可以在这个位置放置一个绝对定位的div.
有一些jQuery插件吗？或者JavaScript代码片段就是这么做的？
Dan*_*scu 33
我已经为meteor-autocomplete寻找了textarea插入符号插件,所以我已经评估了GitHub上的所有8个插件.到目前为止,胜利者是来自Component的textarea-caret-position.
特征
- 像素精度
- 没有任何依赖
- 浏览器兼容性:Chrome,Safari,Firefox(尽管有两个 漏洞),IE9 +; 可以工作,但没有在Opera,IE8或更早版本中测试过
- 支持任何字体系列和大小,以及文本转换
- 文本区域可以具有任意填充或边框
- 不会被textarea中的水平或垂直滚动条混淆
- 支持硬回车,标签(IE上除外)和文本中的连续空格
- 在比文本区域中的列长的行上的正确位置
- 当包裹长词时,在行尾的空白处没有"鬼"位置
这是一个演示 - http://jsfiddle.net/dandv/aFPA7/
这个怎么运作
<div>屏幕外创建一面镜子,风格与之完全相同<textarea>.然后,直到插入符号的textarea的文本被复制到div中,并且<span>在它之后插入a .然后,跨度的文本内容被设置为textarea中文本的剩余部分,以便忠实地再现人造div中的包装.
这是保证处理与包装长行相关的所有边缘情况的唯一方法.它也被GitHub用来确定其@用户下拉列表的位置.
- 我只是注意到在"ranodm"文本之间,你有Carly Rae Jepsen的歌词 - Call Me Maybe(http://www.youtube.com/watch?v=fWNaR-rxAic).但很好的建议!但是,它最近的Chrome版本有一个错误.您可以从一行的开头到中间进行选择.然后单击该行的开始.红线不会移动. (3认同)
- 你是魔术师.我不知道你是如何工作的. (2认同)
| 归档时间： |
|
| 查看次数： |
12084 次 |
| 最近记录： |