js實現文本框中焦點在最后位置

2019-11-20 21:00:53

字體：大中小

來源：轉載

供稿：網友

在一般的程序中.程序員做輸入框內容正確性檢測時一般喜歡通過判斷內容的合法性來確定焦點框.

如:

if(obj.value==""){
   obj.focus();
   return false;
}

這樣當哪一項輸入框為空是就將焦點移動那一項輸入框..這項功能使用起來非常方便..但是存在一個小小的問題...

那就是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>

這個代碼是在用戶體驗的細節性上會對設計師有很大的幫助...

上一篇：js判斷頁面中是否有指定控件的簡單實例

下一篇：js設置文本框中焦點位置在最后的示例代碼(簡單實用)