Harvard Extension School
CSCI E-12 Fundamentals of Web Site Development | Spring 2020

## HTML5: Autofocus

Autofocus will bring the "focus" of the cursor to that field when the page loads. Typically, you would bring focus to the first input field of the form.

XML syntax:

    <input type="text" autofocus="autofocus" name="q"/>

HTML syntax:

    <input type="text" autofocus name="q">

Example 3.18 - Input autofocus property - Example 3.18 | Example 3.18 JSFiddle

- Markup
- Screenshot

    <form action="https://cscie12.dce.harvard.edu/echo" method="post">
    <fieldset><legend>Autofocus</legend><p>The following field should "autofocus":</p>
    <p>Name:
    <input size="50" name="name" type="text" autofocus="autofocus"/></p>
    </fieldset><p>
    <input type="submit"/></p>

    </form>

Copyright © David Heitmeyer