HTML & CSS Course
HTML & CSS
/
Intermediate

Autocomplete

Definition

The `autocomplete` attribute provides a hint to the web browser on how to automatically fill out form fields based on the user's previously saved data.

Explain Like I'm New

When you checkout on an e-commerce site, and you click the 'First Name' box, a yellow dropdown appears with your actual name, and clicking it magically fills out your address, phone number, and credit card instantly. That happens because the developer specifically tagged the inputs with `autocomplete="given-name"` and `autocomplete="street-address"`.

Real World Example

Speeding up checkout flows. Users hate typing their address. Proper autocomplete increases conversion rates massively.

Common Use Cases

  • •E-commerce checkouts
  • •User registration flows

Interactive Example

Interview Questions

basic

  • What attribute turns on browser autofill for a specific field?

intermediate

  • How do you completely turn OFF autocomplete for a sensitive field?

Flash Cards

Question

What attribute?

Click to reveal answer
Answer

The `autocomplete` attribute. (e.g., `autocomplete="email"`).

Question

How to turn it off?

Click to reveal answer
Answer

Set it to `off` or a random string. (e.g., `autocomplete="off"` or `autocomplete="new-password"`). This stops the browser from suggesting previous entries.