使用TextRange获取输入框中光标的位

原创 2005年05月20日 09:50:00
   TextRange是用来表现HTML元素中文字的对象,虽然我们平时不太常用这个对象,可是它却在IE4.0中就已提供了。不过TextRange提供的调用方法却都比较晦涩,那么我们能拿它做些什么呢?

    TextRange的传统用途是对用户在Web页上用鼠标圈选的文字内容的操作,比如变化、删除、新增等。但其经典的用途却是,在Web页面中查找文字(这个比较简单)和获取输入框光标的位置。其中后者又有可以衍生出很多更有用的用途,比如:限制输入的MaskTextBox,其核心技术点就是获取输入框的光标位置,然后使用正则表达式判断输入内容。还有我后面会介绍的"使用方向键在输入框矩阵中自然的导航",核心技术点也是获取输入框中的光标位置。

    获取输入框中的光标位置的整个代码其实很短,只是这些对象和方法不太常用而已。
<script language="javascript">
function GetCursorPsn(txb)
{
    
var slct = document.selection;
    
var rng = slct.createRange();
    txb.select();
    rng.setEndPoint(
"StartToStart", slct.createRange());
    
var psn = rng.text.length;
    rng.collapse(
false);
    rng.select();
    
return psn;
}

</script>


    要彻底的弄清楚TextRange的具体用法,需要了解与其相关的一些内容,请参考MSDN

    这里说一下使用这个GetCursorPsn()方法后,会给输入框操作带来的副作用。对于输入框<input type="text" onkeydown="GetCursorPsn(this)">,它将不能再使用Shift+左右这两个方向键来选择文本;对于<textarea onkeydown="GetCursorPsn(this)"></textarea>,将不能再使用Shift+上下左右四个方向键来选择文本。因为代码在获取了当前光标到文本的startPoint后,调用rng.collapse(false);会改变文本筐内文本的EditPoint。不过这个副作用基本不会给我们使用文本框带来什么大的问题,所以基本不用太在意。 

使用TextRange获取输入框中光标的位置

TextRange是用来表现HTML元素中文字的对象,虽然我们平时不太常用这个对象,可是它却在IE4.0中就已提供了。不过TextRange提供的调用方法却都比较晦涩,那么我们能拿它做些什么呢?   ...
  • abaloneking
  • abaloneking
  • 2005年08月19日 15:47
  • 636

使用TextRange获取输入框中光标的位置

     TextRange是用来表现HTML元素中文字的对象,虽然我们平时不太常用这个对象,可是它却在IE4.0中就已提供了。不过TextRange提供的调用方法却都比较晦涩,那么我们能拿它做些什么...
  • jelink
  • jelink
  • 2006年11月05日 22:49
  • 3052

JS获取和设置光标的位置

function getCursortPosition (ctrl) {//获取光标位置函数 var CaretPos = 0; // IE Support if (document.select...
  • qq873113580
  • qq873113580
  • 2013年10月12日 11:17
  • 1783

在页面中 js 获取光标/鼠标的坐标,获取光标的的像素坐标

近期为网站开发页面统计,以前虽然也开发过,但是功能不是很全,所以这次把一些好功能给用上。 例如这次的,页面JS光标/鼠标坐标,你也许问着有什么用,百度统计中有个热点统计图,这下清楚明白了吧。 好了,上...
  • wljk506
  • wljk506
  • 2013年11月11日 09:54
  • 1373

js获取和设置文本框光标的位置

function getCursortPosition(ctrl) {//获取光标位置函数 var CaretPos = 0; // IE Support if (document.selecti...
  • wuxhyou
  • wuxhyou
  • 2011年11月25日 15:21
  • 6770

在C#中获取文本框中光标所在位置

在C#中获取文本框中光标所在位置 首先定义API函数const int EM_GETSEL = 0xB0;const int EM_LINEFROMCHAR = 0xC9;const int EM_L...
  • ggw128
  • ggw128
  • 2008年04月06日 16:23
  • 2100

光标输入框定位和获取位置

应用场景, 这指定的输入框中不同的文本位置,插入 标识符。 核心代码  //光标定位的处理jquery-position.js中的核心代码 $.fn.extend({ ...
  • zhxh0376
  • zhxh0376
  • 2015年10月14日 15:07
  • 897

iOS TextField 获取光标的位置

获取UITextField当前光标的位置,找了好久都没有找到合适的方法,后面阅读文档写出来了,就详细写出来,分享给大家。...
  • LL845876425
  • LL845876425
  • 2015年12月26日 00:10
  • 3716

如何调整html 中 input里面的输入光标大小

以前在项目里碰到过一个问题 input输入框用一个背景图模拟,设置height和line-height一样的高度,使里面的输入文字能够居中, 在FF下出现的情况是:点击input时,输入光...
  • xiongzhengxiang
  • xiongzhengxiang
  • 2011年08月17日 17:29
  • 4732

MySQL光标的使用

在编写存储过程时,查询可能返回多条记录,如果,数据量非常大,则需要使用光标来逐条读取查询结果集中的记录 光标,是一种用于轻松处理多行数据的机制光标的声明使用光标处理结果集中的数据,需要先声明光标 ...
  • nangeali
  • nangeali
  • 2017年07月25日 23:57
  • 1032
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:使用TextRange获取输入框中光标的位
举报原因:
原因补充:

(最多只允许输入30个字)