Harvard Extension School, Fall 2018
CSCI E-12 Fundamentals of Web Site Development

## 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