Js implementation text box focus in the last position

  • 2020-03-30 02:13:53
  • OfStack

In ordinary programs, programmers like to determine the focus box by determining the validity of the input box content.

Such as:


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

In this way, when the input field is empty, the focus will be moved to the input field.. This feature is very convenient to use.. But there is a small problem...

Obj. focus() moves the focus to the input field and moves the text cursor (that is, the flashing vertical bar) to the position of the first character in the field... As far as the above judgment is concerned.. If there is no content in the text box.. Obj. focus is just the thing that allows us to type directly into a text box without having to click on the text box to get the text in focus...

However, if the text box already has content.. Obj. focus() also moves the cursor to the position of the first character in the text box. This is where the user experience designers get frustrated... What we need is the text box to get focus, and then the text cursor to move to the end of the text box, so that the user can enter content directly without clicking on the text box.. The input will be appended to the original content..

The following code completes this small detail:


<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>

This code will be of great help to the designer in the details of the user experience...


Related articles: