Set cursor position in an input text field

Question

After a lot of search I found the following threads:

define cursor position in form input field

jQuery Set Cursor Position in Text Area

Unfortunately

Answer 1

Inside your <script></script> tag is where your JavaScript goes (although we prefer putting it in a separate file, so that no JavaScript lives on the HTML page itself).

Inside that, you have a call to $(document).ready(), which passes a function() { ... }. Inside that function is all the code that will be executed when your document has loaded.

Inside that function you have a call to $('#site').focus() which itself provides a function — this time one that will be called whenever the #site element gains focus. And presumably that's where you want to change the cursor position.

So, taking the setCursor function from Set cursor at a length of 14 onfocus of a textbox you can put that anywhere in your <script></script> and then inside that innermost function of yours you can write:

if( this.value == this.defaultValue ) {
    $(this).val("http://");

    var node = $(this).get(0);
    setCursor(node,node.value.length);
}

Answer 2

I think I found the error in your setCursor method. The moveStart and moveEnd methods expect two arguments, the first being the unit it should use. Also, the end position appears to be relative to the start position. So I think instead of

    textRange.moveEnd(pos);
    textRange.moveStart(pos);

you want

    textRange.moveStart('character', pos);
    textRange.moveEnd('character', 0);

See: http://msdn.microsoft.com/en-us/library/ie/ms536623(v=vs.85).aspx