An Example of HTML5 Code for Autocomplete in a Detailed HTML List

By using the autocomplete attribute, the browser can suggest values based on previously typed input when a user begins typing in a field. In the case of a select box, when a user presses a key on the keyboard, the browser displays options for the field. To see an example of this functionality in action, check out the demo in Solution 3. It’s worth noting that this is the default behavior of a drop-down list.

The autocomplete feature can be enabled or disabled using the autocomplete attribute, either by setting it to “on” or “off”, for an input or a form field.

By utilizing the autocomplete attribute, the browser can anticipate the input of the user. As soon as the user starts typing in the field, the browser will showcase a list of options based on previously typed values to fill in the field.

The autocomplete can be “on” for the input, and “off” for particular input fields, or vice versa.
Note: The

autocomplete

attribute works with such

types, like text, search, tel, url, password, email, range, and color.

Syntax

Applies to The form and input tags.
Example of the HTML

autocomplete

attribute:

html>
<html>
  <head>
    <title>Title of the documenttitle>
    <style>
      div {
        margin-bottom: 10px;
      }
    style>
  head>
  <body>
    <form action="/form/submit" method="get" autocomplete="on">
      <div>
        <label for="name">Enter Your Name:label>
        <input type="text" name="name" id="name">
      div>
      <div>
        <label for="phone">Enter Your Phone Number:label>
        <input type="number" id="phone" name="phone-number">
        <br>
      div>
      <input type="submit" value="Send">
    form>
  body>
html>

Example of the HTML
tag where the

autocomplete

attribute is on:

html>
<html>
  <head>
    <title>Title of the documenttitle>
    <style>
      input {
        display: block;
        margin-bottom: 10px;
        padding: 10px;
      }
    style>
  head>
  <body>
    <form action="/form/submit" accept-charset="ISO-8859-1">
      <input type="text" name="name" placeholder="Enter your Name" autofocus>
      <input type="text" name="surname" placeholder="Enter your Surname">
      <input type="number" name="age" placeholder="Enter your Age" autocomplete="off">
      <input type="submit" value="Send">
    form>
  body>
html>

Frequently Asked Questions