javascript焦点到文本框终了

javascript焦点到文本框末尾
曾经有这么一张帖子：
在一般的程序中.程序员做输入框内容正确性检测时一般喜欢通过判断内容的合法性来确定焦点框. 

如: 

if(obj.value==""){ 

   obj.focus(); 

   return false; 

}

 
在Jquery中可以直接调用$("#idEle").focus();来获取焦点。
这样当哪一项输入框为空是就将焦点移动那一项输入框..这项功能使用起来非常方便..但是存在一个小小的问题... 

那就是obj.focus()将焦点移动到输入框后,会将文字光标(就是一闪一闪的竖线)移动到这个输入框的第一个字符的位置...就上面的判断而言..如果文本框中没有内容..obj.focus正好可以满足我们直接在文本框中输入内容而不用点击一下文本框以使文本有焦点... 

但是,如果文本框中已经有内容了..但是这个内容不合法.obj.focus()同样的将光标移动到了这个文本框的第一个字符的位置..这时就会让注意用户体验的设计师郁闷了...我们需要的是文本框得到焦点,然后文字光标移动到文本框的最后,让用户可以不用点击文本框直接输入内容..输入的内容会在原来的内容的后面追加起来.. 

下面的代码可以完成这个小细节: 

<script language="javascript"> 
function getSelectPos(obj){ 
var esrc = document.getElementById(obj); 
if(esrc==null){ 
   esrc=event.srcElement; 
} 
var rtextRange =esrc.createTextRange(); 
rtextRange.moveStart('character',esrc.value.length); 
rtextRange.collapse(true); 
rtextRange.select(); 
} 
</script>

但是在我兴致勃勃的去尝试以上代码的时候，悲催的发现谷歌浏览器不支持“createTextRange”方法！

于是继续寻找，然后得到上述代码的支持多浏览器升级版：

function getSelectPos(obj){
 var esrc = document.getElementById(obj);
 if(esrc==null){
 esrc=event.srcElement;
 }
 //ie
 if(typeof esrc.createTextRange!=="undefined"){
 var rtextRange =esrc.createTextRange();
 rtextRange.moveStart('character',esrc.value.length);
 rtextRange.collapse(true);
 rtextRange.select();
 }
 //other
 else if(typeof esrc.selectionStart!=="undefined")
 {
 esrc.selectionStart=esrc.value.length;
 esrc.focus();
 }
 //not suppert
 else{
 alert("not support");
 }
}

不过以上代码我调试后，发现无论是IE还是chrome都是输出"not support";

请问要在谷歌浏览器中实现输入光标（焦点）移动至末尾，代码怎么写？ javascript 浏览器 输入框光标移动至末尾
[解决办法]
chrome/firefox 调用focus后会自动返回到输入框内容上一次鼠标的位置，如果不在最后需要移动到最后可以使用selectionStart属性

<script type="text/javascript">
    function test(obj) {
       if (typeof obj == 'string') obj = document.getElementById(obj);
        obj.focus();
        if (obj.createTextRange) {
            var rtextRange = obj.createTextRange();
            rtextRange.moveStart('character', obj.value.length);
            rtextRange.collapse(true);
            rtextRange.select();
        }
        else if (obj.selectionStart) obj.selectionStart = obj.value.length; 
 
    }
</script><input type="text" id="txt1" /><input type="button" onclick="test('txt1');" value="执行" /><br />
<input type="text" id="txt2" /><input type="button" onclick="test('txt2');" value="执行" />

[解决办法]
用 div???你可以只用一个input浮动于所有div上边就好..从视角上完全看不出来,

查看更多 下一篇