Для чего нужен атрибут autocomplete и какие параметры он принимает?

Атрибут autocomplete позволяет браузеру предоставлять автозаполнение для полей формы. Он повышает удобство использования, предлагая сохраненные ранее данные.

Параметры атрибута autocomplete делятся на два типа: общие и по типу данных.

Общие параметры:

• off: Запрещает автозаполнение для данного поля.
• on: Включает автозаполнение для данного поля.

Параметры по типу данных (наиболее часто используемые):

• name: Полное имя пользователя.
• honorific-prefix: Приставка перед именем (например, "Mr.", "Ms.").
• given-name: Имя.
• additional-name: Дополнительные имена (отчество).
• family-name: Фамилия.
• honorific-suffix: Приставка после имени (например, "Jr.", "Sr.").
• nickname: Псевдоним.
• email: Адрес электронной почты.
• username: Имя пользователя.
• new-password: Новый пароль (для поля создания пароля).
• current-password: Текущий пароль (для поля ввода существующего пароля).
• one-time-code: Одноразовый код (например, для двухфакторной аутентификации).
• organization-title: Должность.
• organization: Название организации.
• street-address: Улица и номер дома.
• address-line1: Первая строка адреса.
• address-line2: Вторая строка адреса.
• address-line3: Третья строка адреса.
• address-level4: Наименьшая административная единица (например, деревня).
• address-level3: Третья по величине административная единица (например, район).
• address-level2: Вторая по величине административная единица (например, город).
• address-level1: Самая большая административная единица (например, область, штат).
• country: Страна.
• country-name: Название страны.
• postal-code: Почтовый индекс.
• cc-name: Имя на кредитной карте.
• cc-given-name: Имя на кредитной карте.
• cc-additional-name: Дополнительные имена на кредитной карте.
• cc-family-name: Фамилия на кредитной карте.
• cc-number: Номер кредитной карты.
• cc-exp: Срок действия кредитной карты (полностью).
• cc-exp-month: Месяц срока действия кредитной карты.
• cc-exp-year: Год срока действия кредитной карты.
• cc-csc: Код безопасности кредитной карты.
• cc-type: Тип кредитной карты.
• transaction-currency: Валюта транзакции.
• transaction-amount: Сумма транзакции.
• language: Предпочитаемый язык.

Параметры могут также включать префиксы, например, shipping или billing, указывая, что это данные для доставки или оплаты, соответственно.

Пример использования:

<form>
  <label for="name">Имя:</label>
  <input type="text" id="name" name="name" autocomplete="given-name">

  <label for="email">Email:</label>
  <input type="email" id="email" name="email" autocomplete="email">

  <label for="street">Улица:</label>
  <input type="text" id="street" name="street" autocomplete="shipping street-address">
</form>