HTML autofocus Attribute
Description
The autofocus attribute is a boolean attribute used in HTML forms to automatically focus a specific form element when the page loads. This means that as soon as the page becomes visible to the user, the element with the autofocus attribute will be the active focus, allowing the user to start typing or interacting with it immediately without having to click on it first. This can be particularly useful for enhancing user experience on forms or input fields where immediate action from the user is expected, such as a search box or the first input of a login form.
The autofocus attribute can be added to elements like <input>, <select>, <textarea>, and <button>. However, it's important to use this attribute judiciously as it can affect accessibility and user experience. For instance, automatically focusing an element on page load could disorient users relying on screen readers or those who expect to navigate the page in a different order. Only one element should have the autofocus attribute per page to avoid confusion about which element is focused.
Syntax
<tagname autofocus>Values
The autofocus attribute is a boolean attribute, therefore no values are associated with this attribute.
Applies To
The autofocus attribute can be used on the following html elements.
Example
<p>Enter your name:</p>
<input type="text" autofocus="autofocus">Browser Support
The following table will show you the current browser support for the HTML autofocus Attribute.
| Desktop | |||||
 |
 |
 |
 |
 |
|
| Yes | Yes | Yes | Yes | Yes | |
| Tablets / Mobile | |||||
|
|
|
|
 |
 |
| Yes | Yes | Yes | Yes | Yes | Yes |
Last updated by CSSPortal on: 29th March 2024