K. Michael K. Michael - 3 years ago 228
CSS Question

JQuery: Make a text input box selected

You know how when you open a new tab, you can start typing without having to select the searchbar? I've got a text input box in HTML, and I'd like to be able to open my webpage and have that text input box immediately typeable, for lack of a better term. Say my input box looks like this:

<input type="text" class="myInput" value="add an item"></input>

I'm using HTML, CSS and Javascript/jQuery right now. What code can I add to make sure the text input box is immediately typeable?

Answer Source

Use autofocus:

<input type="text" class="myInput" value="add an item" autofocus/>

From the input documentation on MDN:

This Boolean attribute lets you specify that a form control should have input focus when the page loads, unless the user overrides it (e.g. by typing in a different control). Only one form element in a document can have the autofocus attribute, which is a Boolean. It cannot be applied if the type attribute is set to hidden (that is, you cannot automatically set focus to a hidden control). Note that the focusing of the control may occur before the firing of the DOMContentLoaded event.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download