通过 JavaScript 获取和设置光标在输入框中的位置(兼容 IE 及 F
function getLocation(elm) {
if(elm.createTextRange) { // IE
var range = document.selection.createRange();
range.setEndPoint('StartToStart', elm.createTextRange());
return range.text.length;
} else if(typeof elm.selectionStart == 'number') { // Firefox
return elm.selectionStart;
}
}
function setLocation(elm, n) {
if(n > elm.value.length)
n = elm.value.length;
if(elm.createTextRange) { // IE
var textRange = elm.createTextRange();
textRange.moveStart('character', n);
textRange.collapse();
textRange.select();
} else if(elm.setSelectionRange) { // Firefox
elm.setSelectionRange(n, n);
elm.focus();
}
}
其中几个函数的说明:
IE:
TextRange.setEndPoint('StartToStart', elm.createTextRange()):将 TextRange 的起始位置调整到 elm.createTextRange() 的起始位置处。第二个参数必须是一个 TextRange,第一个参数必须为以下四个值:StartToStart、StartToEnd、EndToStart、EndToEnd,StartToStart 的意思就是将 TextRange 的起始位置设置为第二个参数的起始位置,同理可知 StartToEnd 的意思就是将 TextRange 的起始位置设置为第二个参数的终止位置,依此类推,EndToStart 和 EndToEnd 也就很好理解了。
TextRange.moveStart('character', n): 将 TextRange 的起始位置后移到 n 个字符处,另外还有一个函数是 moveEnd('character', n),这是移动 TextRange 的终止位置,若要将终止位置前移,应使用 -n 而不是 n(假定 n 为正数)。
TextRange.collapse():将文本插入点设置到 TextRange 当前起始位置处,若要设置到终止位置处,使用 TextRange.collapse(false)。实际上,设置插入点就是起点和终点设置到同一位置上,这大概也就是 collapse 这个名称的来由吧。所以,该语句也可换成 textRange.moveEnd('character', n - elm.value.length),只是看起来没那么简明而已。
关于 TextRange 对象,查询一下 IE 的 DOM 手册便知。
相关新闻>>
- Javascript 兼容 IE6、IE7、FF 的“加入收藏”“设为首页”
- JS获取农历日期
- js 中时间相减
- 好好学一遍JavaScript 笔记(一)——基础中的基础
- 好好学一遍JavaScript 笔记(二)——encode、数组、对象创建
- 好好学一遍JavaScript 笔记(三)——StringBuffer、prototype
- 好好学一遍javaScript 笔记(四)——Attribute、HTML元素、文档碎
- 好好学一遍JavaScript 笔记(五)——正则表达式基础
- 好好学一遍JavaScript 笔记(六)——正则表达式基础二
- 好好学一遍JavaScript 笔记(七)——RegExp对象与常用正则
- 发表评论
-
- 最新评论 更多>>