当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 光标的一些操作总结

Javascript
二级连动的另一个不错的实现方法
键盘元素的控制小方块的移动效果
如何丰富alt属性的显示效果
鼠标移动到某个单元格上后,整个列都变色的实现方法
用JavaScript实现字符串切分功能
通过JAVAScript实现页面自适应
短信提示使用 特效
一个多次搜索+多次传值的解决方案
javascript读取RSS数据
WEB泡泡堂2.0(图形界面+电脑对玩)(javascript)
JS+FLASH幻灯片播放图片脚本,整理了代码,使得调用更加方便!
利用javascript中的call实现继承
javascript 中对象的继承〔转贴〕
float ad浮动广告代码
showModalDialog 和 showModelessDialog
Ajax::prototype 源码解读
深入认识JavaScript中的函数
Javascript技术技巧大全(五)
通过MSXML2自动获取QQ个人头像及在线情况(给初学者)
用正则xmlHttp实现的偷(转)

Javascript 中的 光标的一些操作总结


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 129 ::
收藏到网摘: n/a

IE下的Range操作比Mozilla下强很多,这里只讨论IE下的操作。
这里选介绍几个光标定位的特点:
1.光标不变
直接obj.focus(),光标会返回之前的位置,即位置不变
2.光标在最前
var r = obj.createTextRange();
r.collapse();
r.select();
用这个方法可以使光标在input框最前面
3.光标在最后
var r = obj.createTextRange();
r.collapse(false);
r.select();
用这个方法可以使光标停在input框的最后
4.选取input框中部分内容需要用到Range的moveStart或moveEnd方法, 其详细的方法使用可以参考MSDN.
<script type="text/javascript">
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();
}
</script>
<input name="a" value="123456789"><input type=button value="select" onclick="sl(a,2,4)">

5.再引申一下光标的移动和位置,这个是有人经常问到的问题 <input name=a value="123456789">
<input type=button value="向前" onclick="setpos(a,-1)">
<input type=button value="向后" onclick="setpos(a,1)">
<input type=button value="当前光标的位置" onclick="getpos(a)">
<script type="text/javascript">
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);
};
</script>