请问,如何用JavaScript获取div中插入符光标的像素位置?

黑玻璃白 2015-07-10 03:08:21
如题,我想要完成的是在可编辑div中实现类似微博@的功能,需要获取插入光标的像素位置。div是可编辑的,width和height可变,输入的字符不限格式,并且可输入的字符数量庞大。
ps:热心的亲们,我们常见的@功能都是在textarea和input中实现的,它们的方法对于div来说不太适用。
pps:不是鼠标位置,不是div元素的位置,是当焦点在div时,div里面一闪一闪的那个插入符光标的像素位置,有x,y的那种,或者 {left = p.left + "px"; top = p.top +"px"; }的那种(*  ̄︿ ̄)

拜谢

...全文
83 回复 打赏 收藏 转发到动态 举报
写回复
用AI写文章
回复
切换为时间正序
请发表友善的回复…
发表回复
xhEditor是一个基于jQuery开发的简单迷你并且高效的可视化XHTML编辑器,基于网络访问并且兼容IE 6.0+,Firefox 3.0+,Opera 9.6+,Chrome 1.0+,Safari 3.22+。 xhEditor is a simple,small,fast WYSWYG(What You See What You Get) XHTML editor based by jQuery. that is webbased and compatible with Internet Explorer 6.0+,Firefox 3.0+,Opera 9.6+,Chrome 1.0+,Safari 3.22+ . xhEditor编辑器官方网站:http://xheditor.com/ Features(特点): Small:初始加载4个文件,包括:1个js(50k)+2个css(10k)+1个图片(5k),总共65k。若js和css文件进行gzip压缩传输,可以进一步缩减为24k左右。即使加上jQuery的24K,总共仅加载48K。 Fast:基于jQuery引擎开发,提供高效的代码执行效率 Simple:简单的调用方式,加一个class属性就能将您的textarea立马变成一个功能丰富的可视化编辑器。 Word:实现Word代码自动检测并清理,提供高效完美的Word代码过滤方案,生成代码最优化精简,但是却不丢失任何细节效果。 UBB:提供完美的UBB可视化编辑解决方案,在您获得安全高效代码存储的同时,又能享受可视化编辑的便捷 Demo(演示): 默认模式:http://xheditor.com/demos/demo01.html 自定义按钮:http://xheditor.com/demos/demo02.html 皮肤选择:http://xheditor.com/demos/demo03.html 其它选项:http://xheditor.com/demos/demo04.html Javascript交互:http://xheditor.com/demos/demo05.html 非utf-8编码网页调用:http://xheditor.com/demos/demo06.html UBB可视化编辑:http://xheditor.com/demos/demo07.html Ajax文件上传:http://xheditor.com/demos/demo08.html 插件扩展:http://xheditor.com/demos/demo09.html iframe调用文件上传:http://xheditor.com/demos/demo10.html 异步加载:http://xheditor.com/demos/demo11.html Interactive(交流) QQ交流群:54432536(验证内容:xheditor) Email:yanis.wang#gmail.com(# = @) ver 1.0.0 rc2 Change(2010-4-1) 添加:添加鼠标悬停延迟自动面板显示功能,提高用户操作效率,延迟时间在初始化时用hoverExecDelay参数设置,单位为毫秒,设置为-1表示关闭此功能 添加:按钮对象添加h参数,h设置为1时代表当前按钮支持鼠标悬停自动显示,此参数同样适用于插件开发 添加:在demo07 UBB演示添加Flv视频演示 添加:集成MSN表情,可在demo07 UBB演示查看显示效果 添加:自带Ajax文件上传添加按Esc取消上传功能 添加:pasteHTML和pasteText函数添加第2个参数:bStart,可以是以下值:留空(覆盖粘贴)、true(粘贴在光标选择区域之前)、false(粘贴在光标选择区域之后) 添加:切换到源代码,可视化编辑页面的光标对应源代码相应位置的定位功能 添加:扩展jQuery的标准val函数,使之能够直接读取和设置编辑器的最新值 添加:为方便外部应用的扩展,特将编辑器内部的window和document开放外部调用,变量名:win,doc 添加:扩展textarea的change事件,使之可以触发编辑器的change 添加:UBB演示demo07添加字节数统计演示 添加:内置Ajax上传和showIframeModal接口参数的url地址可以使用“{editorRoot}”内置变量,用来定位编辑器文件夹的页面,例如:{editorRoot}xheditor_plugins/test.html 修正:
已编排格式的换行和制表丢失问题的修正 
修正:最终代码提交时没有进行压缩问题的修正 
修正:表情没有插入alt信息问题的修正 
修正:表情分组切换时产生右移1像素位移问题的修正 
修正:当按钮的鼠标悬停样式偶尔失效时,按钮面板会产生右移1像素问题的修正 
修正:带面板的按钮包括插件,快捷键触发或者直接外部调用会产生错误问题的修正 
修正:IE浏览器预览时,会跑至页面尾部问题的修正 
修正:Firefox 3.6从源代码切换回来光标丢失问题的修正 
修正:p和div标签内部的 占位被清除,造成块标签零高度问题的修正 
修正:IE拖动img大小不更新width和height属性值问题的修正 
修正:IE浏览器下在表格粘贴会位置错乱问题的修正 
修正:IE浏览器下超链接的链接文字,在超链接是“http://”开头的情况下,输入“http://”开头文字无效的修正 
修正:UBB模块style="text-align:*"没转换成[align=*]问题的修正 
修正:IE6下打开面板某些情况下会出现方形白色区域问题的修正 
修正:加载多个编辑器时,用于IE粘贴处理的临时隐藏iframe被重复加载问题的修正 
修正:IE6下某些情况下全屏后再取消全屏导致浏览器崩溃问题的修正 
调整:所有img图片强制添加alt标签,以使代码合XHTML标准 
调整:对ubb插件进行了适当的调整,以兼容以下不标准情况:无[list]和[/list]结尾的[*]标识 
调整:优化formatXHTML函数,提高解析器工作效率 
调整:API函数setSource由原先的延迟写入,修改为立即写入 
调整:更换为更完善的IE光标丢失问题解决方案 
调整:为兼容w3c标准,原xheditor专有属性初始化模式,变更为直接在class写参数,例:class="xheditor {skin:'o2007blue'}" 
调整:为兼容电驴、快播等特殊URL,超链接、图片、FLASH和多媒体4个按钮的批量插入分隔,由原先的“|”变更为制表(\t) 
调整:编辑器初始化代码由原先的xheditor(true,参数)精简为xheditor(参数)

87,937

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧