文章探索:   分类:    关键字:  
  + 栏目导航
  + 相关文章
document 对象
Window.Open详解
JS replace 方法
JScript 属性
JScript 对象
JScript 方法
关于window.opener的用法
JavaScript语法——style.display 属..
不被拦截的弹出窗口代码
showModalDialog和showModelessDialog..
showModelessDialog()使用详解
IE中非模式对话框(showModelessDialog..
JS eval()函数
Preferences 指南
JS中的setTimeout和setInterval的区别
JavaScript对象与数组参考大全
javascript动态增加、删除、填充表格..
用Java实现几种常见的排序算法
JavaScript 日期函数
JavaScript 使用字符串函数
如何用Javascript获得TextArea中的光..
Document 对象方法
在input中只能输入数字
selection.createRange() 用法例子
获取网页各种宽高的值
JavaScript方法 - indexOf方法
substring函数详解
40种网页常用小技巧(javascript)
event.X和event.clientX有什么区别
clientX, clientY,offsetX, offsetY,..


技术教程 -> JavaScript教程 ->  
如何用Javascript获得TextArea中的光标位置
来源:转载   人气:1683   录入时间:2007-11-8
     小弟最近在写一个在线编辑器,UBB版的,由于没有使用弹出窗口,所以,在添加代码的时候,只能添在TextArea的最后面,无法在光标之前插入,于是在网上疯狂的找资料,工夫不负有心人,终于被我找到了如何获得TextArea中的位置,但是如果TextArea中有很多内容的时候,会显得很闪烁。其代码如下。
   
     function getPos(obj)
     {
     obj.focus();
     var workRange=document.selection.createRange();
     obj.select();
     var allRange=document.selection.createRange();
     workRange.setEndPoint("StartToStart",allRange);
     var len=workRange.text.length;
     workRange.collapse(false);
     workRange.select();
   
     return len;
     }
   
     这时候问题出来了,在obj.select()的时候,会造成闪烁,并且滚动条也无法归位。于是小弟根据自己的需要,将其改写如下:
   
   function getCaret(ZysrID)
   {
    var txb = document.getElementById(ZysrID);//根据ID获得对象
    var pos = 0;//设置初始位置
    txb.focus();//输入框获得焦点,这句也不能少,不然后面会出错,血的教训啦.
    var s = txb.scrollTop;//获得滚动条的位置
    var r = document.selection.createRange();//创建文档选择对象
    var t = txb.createTextRange();//创建输入框文本对象
    t.collapse(true);//将光标移到头
    t.select();//显示光标,这个不能少,不然的话,光标没有移到头.当时我不知道,搞了十几分钟
    var j = document.selection.createRange();//为新的光标位置创建文档选择对象
    r.setEndPoint("StartToStart",j);//在以前的文档选择对象和新的对象之间创建对象,妈的,不好解释,我表达能力不算太好.有兴趣自己去看msdn的资料
    var str = r.text;//获得对象的文本
    var re = new RegExp("[\\n]","g");//过滤掉换行符,不然你的文字会有问题,会比你的文字实际长度要长一些.搞死我了.我说我得到的数字怎么总比我的实际长度要长.
    str = str.replace(re,"");//过滤
    pos = str.length;//获得长度.也就是光标的位置
    r.collapse(false);
    r.select();//把光标恢复到以前的位置
    txb.scrollTop = s;//把滚动条恢复到以前的位置
   }
   
   //设置光标函数
   
   function setCaret(id,pos)
   {
     var textbox = document.all(id);
     var r = textbox.createTextRange();
     r.collapse(true);
     r.moveStart('character',pos);
     r.select();
   }
   
     其实这个不难,但不知道的时候,会搞死人的。我为了实现这个效果,前前后后差不多试了五个小时,妈的。但愿这个对一些兄弟有帮助。
   




Copyright(C)2007-2021 广州市佳沛数码科技有限公司 版权所有
公司地址: 广州市荔湾区东漖北路560号511室
电话:020-81803473 传真:020-81544987