Alex Rivera | Logout

How to focus on a form input text field on page load using jQuery?

Asked 2009-10-20T00:46:29.287
301

This is probably very simple, but could somebody tell me how to get the cursor blinking on a text box on page load?

Edit
Report

2 Answers

21

Think about your user interface before you do this. I assume (though none of the answers has said so) that you'll be doing this when the document loads using jQuery's ready() function. If a user has already focussed on a different element before the document has loaded (which is perfectly possible) then it's extremely irritating for them to have the focus stolen away.

You could check for this by adding onfocus attributes in each of your <input> elements to record whether the user has already focussed on a form field and then not stealing the focus if they have:

var anyFieldReceivedFocus = false;

function fieldReceivedFocus() {
    anyFieldReceivedFocus = true;
}

function focusFirstField() {
    if (!anyFieldReceivedFocus) {
        // Do jQuery focus stuff
    }
}


<input type="text" onfocus="fieldReceivedFocus()" name="one">
<input type="text" onfocus="fieldReceivedFocus()" name="two">
answered 2009-10-20T08:51:18.563
14

HTML:

  <input id="search" size="10" />

jQuery:

$("#search").focus();
answered 2009-10-20T00:51:18.653

Your Answer