当输入框(input/textarea)获得焦点时,将焦点移动到最后,在某些情况下用户体验很好。网上的大部分方法都是针对IE浏览器的。代码如下:
var el =
document.getElementById
(
'txtArticle'
);
var range = el.createTextRange ( );
range.moveStart ( 'character', el.value.length );
range.collapse ( false );
range. select ( );
var range = el.createTextRange ( );
range.moveStart ( 'character', el.value.length );
range.collapse ( false );
range. select ( );
其实可以将moveStart这行删除,因为createTextRange方法创建range后,利用collapse方法,参数为false就可以移动到最后了。collapse(true)移动光标到range的开始,collapse(false)移动光标到range的结尾。 Firefox等标准浏览器可以使用w3c的setSelectionRange方法。代码如下:
var range, el =
document.getElementById
(
'txtPhone'
);
if (el.setSelectionRange ) {
el. focus ( );
el.setSelectionRange (el.value.length, el.value.length )
} else {
range = el.createTextRange ( );
range.collapse ( false );
range. select ( );
}
if (el.setSelectionRange ) {
el. focus ( );
el.setSelectionRange (el.value.length, el.value.length )
} else {
range = el.createTextRange ( );
range.collapse ( false );
range. select ( );
}
注意setSelectionRange方法仅适用于input/textarea元素。其它非原生的可编辑元素的焦点移到可以利用selection对象的collapse方法,例如:
var sel, el =
document.getElementById
(
'hint'
);
sel = window. getSelection ( );
sel.collapse (el, 1 );
el. focus ( );
sel = window. getSelection ( );
sel.collapse (el, 1 );
el. focus ( );