javascript - define cursor position in form input field

Question

I have several input fields with default values. I defined tabindexes to jump from field to field with the tab-button. The problem is that when I get to a field the whole text gets selected, and it is replaced if I start to type. I would like to set the cursor position to the end of the pre-filled text. How can I do this ?

Answer 1

By defining onfocus event on every node. And setting caret position to the end. Because of the default focus/click behavior, setting cursor should be deferred.

function setCursorAtEnd(node){
    setTimeout(function(){
         setCursor(node,node.value.length);
    },10);
}

<input onfocus="setCursorAtEnd(this)" value="bla"/>

The setCursor function you can find in this question: Set cursor at a length of 14 onfocus of a textbox