À quoi sert l'attribut autocomplete et quels…

L'attribut autocomplete permet au navigateur de fournir une saisie semi-automatique pour les champs du formulaire. Il améliore la convivialité en proposant des données précédemment enregistrées.

Les paramètres de l'attribut autocomplete se divisent en deux types : généraux et par type de données.

Paramètres généraux :

off : Interdit la saisie semi-automatique pour ce champ.
on : Active la saisie semi-automatique pour ce champ.

Paramètres par type de données (les plus couramment utilisés) :

name : Nom complet de l'utilisateur.
honorific-prefix : Préfixe avant le nom (par exemple, "Mr.", "Ms.").
given-name : Prénom.
additional-name : Noms supplémentaires (deuxième prénom, etc.).
family-name : Nom de famille.
honorific-suffix : Suffixe après le nom (par exemple, "Jr.", "Sr.").
nickname : Surnom.
email : Adresse e-mail.
username : Nom d'utilisateur.
new-password : Nouveau mot de passe (pour les champs de création de mot de passe).
current-password : Mot de passe actuel (pour les champs de saisie du mot de passe existant).
one-time-code : Code à usage unique (par exemple, pour l'authentification à deux facteurs).
organization-title : Titre de l'organisation.
organization : Nom de l'organisation.
street-address : Adresse (rue et numéro).
address-line1 : Première ligne de l'adresse.
address-line2 : Deuxième ligne de l'adresse.
address-line3 : Troisième ligne de l'adresse.
address-level4 : La plus petite unité administrative (par exemple, village).
address-level3 : La troisième unité administrative par taille (par exemple, district).
address-level2 : La deuxième unité administrative par taille (par exemple, ville).
address-level1 : La plus grande unité administrative (par exemple, région, état).
country : Pays.
country-name : Nom du pays.
postal-code : Code postal.
cc-name : Nom sur la carte de crédit.
cc-given-name : Prénom sur la carte de crédit.
cc-additional-name : Noms supplémentaires sur la carte de crédit.
cc-family-name : Nom de famille sur la carte de crédit.
cc-number : Numéro de la carte de crédit.
cc-exp : Date d'expiration de la carte.
cc-exp-month : Mois d'expiration.
cc-exp-year : Année d'expiration.
cc-csc : Code de sécurité de la carte.
cc-type : Type de carte de crédit.
transaction-currency : Devise de la transaction.
transaction-amount : Montant de la transaction.
language : Langue préférée.

Les paramètres peuvent également inclure des préfixes, comme shipping ou billing, indiquant qu'il s'agit de données d'expédition ou de paiement, respectivement.

Exemple d'utilisation :

<form>
  <label for="name">Nom :</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">Rue :</label>
  <input type="text" id="street" name="street" autocomplete="shipping street-address">
</form>

À quoi sert l'attribut autocomplete et quels paramètres accepte-t-il?