javascript光标定位
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
javascript光标定位
[JavaScript] view plain copy
1.<mce:script type="text/javascript"><!--
2.function moveCursor(){
3.var temp=this.txtNum.value;
4.if(isNaN(temp))
5.{
6.alert("请输入一个数字");
7.return;
8.}
9.
10.var rng=this.txtT est.createTextRange();
11./*1.创建一个TextRange对象,BODY、TEXT、TextArea、BUTTON等元素都支持这个方法。
该方法返回一个TextRange对象。
*/
12.rng.move("character",temp);
13./*2.move("Unit"[,count])
14.move()方法执行两个操作。
首先,方法在前一个结束点的位置重叠当前文档,将这里作为一个插入点;下一步,它将插入点向前或向后移动任意个字符、单词或句子单位。
15.方法的第一个参数是字符串,它指定的单位有character(字符)、word(词)、sentence(段落)、textedit。
textedit值将插入点移动到整个文本范围的结束处(不需要参数)。
如果指定为前三种单位,忽略参数时默认值为1,也可以指定一个整数值来指示单元数,正数代表向前移动,负数代表向后移动。
16.注意在move()方法执行后范围仍是重叠的。
*/
17.rng.select();
18./*select()方法选择当前文本范围内的文本,这里的显示光标也必须利用它来实现,因为所谓的"光标"可以理解为边界重合的范
围*/
19.}
20.
21.// --></mce:script>
22.</head>
23.<body>
24.<input type="text" name="txtTest" value="明·罗贯中《三国演义》第二十一回操曰:“夫英雄者,胸怀大志,腹有良谋,有包藏宇宙之机,吞吐天地之志者也。
" size="100" /><br />
25.移动光标到第<input type="text" name="txtNum" size="5" />个位置
26.<input type="button" name="btnMove" value="确定" onclick="moveCursor()" />
27.</body>
// /*2光标放在最前面ie中OK,firefox中无效果*/
// function moveCursor(){
// var textTest=document.getElementsByName("txtTest");
// var r=txtTest.createTextRange();
// r.collapse();
// r.select();
// }
/*3光标放在最后面ie中OK,firefox中无效果*/
// function moveCursor(){
// var textTest=document.getElementsByName("txtTest");
// var r=txtTest.createTextRange();
// r.collapse(false);
// r.select();
// }
/*4选取input框中部分内容需要用到Range的moveStart或moveEnd方法,其详细的方法使用可以参考MSDN*/
//function sl(o,m,n){
// var rt=o.createTextRange();
// rt.collapse();
// rt.select();//光标移到最前
// var r=document.selection.createRange();
// r.collapse(false);
// r.moveStart("character",m);//从m位开始
// r.moveEnd("character",n);//选取n位
// r.select();
//}
<input name="a" value="12344563789" />
<input type="button" value="select" onclick="sl(a,2,4)"/>
/*5光标的移动和位置*/
function setpos(obj,n)
{
obj.focus();
var r=document.selection.createRange();
r.collapse(false);
r.move("character",n);
r.select();
}
function getpos(obj)//得到文本框内光标的位置
{
obj.focus();//光标位置不变
var r=document.selection.createRange();
r.collapse(false);
r.setEndPoint("StartToStart",obj.createTextRange());
alert(r.text.length);
}
例五
<input type="button" value="向前" onclick="setpos(a,-1)"/> <input type="button" value="向后" onclick="setpos(a,1)"/> <input type="button" value="当前光标的位置" onclick="getpos(a)" />。