Comment utiliser autocomplete="bday" au format MM/JJ/AAAA ?
P粉757432491
P粉757432491 2024-03-21 21:33:54
0
1
413

J'utilise un masque de saisie au format <input type="text"> 上强制执行 MM/DD/YYYY.

Je souhaite utiliser autocomplete="bday", mais je ne souhaite pas utiliser le format de trait d'union spécifié par WHATWG.

Que puis-je faire à ce sujet ? Puis-je m'attendre à ce que les navigateurs mobiles (principalement iOS/Android) saisissent correctement les champs dans cette case.

P粉757432491
P粉757432491

répondre à tous(1)
P粉005134685

Utilisez la saisie du type de date au lieu de toute autre chose

Dans un monde idéal, votre saisie devrait être de type date plutôt que de type texte. En théorie, il présente les avantages suivants :

  • Entrez et affichez les dates dans les paramètres régionaux préférés de l'utilisateur
  • Contient un widget de calendrier pour sélectionner les dates
  • Validation de base des champs front-end qui garantit généralement que vous avez toujours une date valide au format aaaa-mm-jj

Mais en pratique,

  • Le type de saisie de date n'est pas pris en charge dans les anciens navigateurs/appareils, en particulier sur certains téléphones (c'est l'essentiel !)
  • Les champs de saisie et/ou les widgets de calendrier associés ne sont pas toujours facilement accessibles (quel dommage !)
  • Vous n'avez aucun contrôle sur l'apparence exacte du composant (idéalement, vous ne devriez pas trop vous en soucier, mais ce n'est pas grave)

Utiliser le type de saisie le plus professionnellement approprié pour un champ donné s'il en existe un (date ici) est généralement la meilleure chose que vous puissiez faire, et vous préparera certainement à long terme du point de vue de l'utilisateur et du développement. La meilleure chose qui puisse être perspective de réalisation/maintenance. Elle est garantie par les normes, ce qui signifie que vous pouvez vous attendre à un meilleur support au fil du temps sans rien faire de votre part, et la fonctionnalité ne disparaîtra pas soudainement.

Cependant, surtout la perte de contrôle sur l'apparence précise et le manque actuel de support, en particulier sur les téléphones mobiles, probablement le plus important, se traduisent malheureusement par une saisie de type de texte sélectionnée, une série de zones de liste déroulante plus ou moins accessibles et/ou un calendrier qui est pas très accessible la plupart du temps, pas seulement des dates de saisie standards.

Si vous ne pouvez pas ou ne voulez pas utiliser la saisie de type date

La saisie semi-automatique remplit toujours les champs au format aaaa-mm-jj, ce qui entre en conflit avec votre format préféré et vous ne pouvez pas le modifier. Vous n’avez donc pas beaucoup de solutions :

  • Soyez tolérant envers les commentaires que vous acceptez, en particulier aaaa-mm-jj et mm/jj/aaaa.
  • Capture la saisie semi-automatique du navigateur et convertit aaaa-mm-jj en mm/jj/aaaa une fois détecté

Les deux rendront votre champ de saisie moins stable, moins fiable et moins compréhensible pour les utilisateurs. Je suppose qu'il n'est pas facile, peut-être même impossible, de détecter de manière fiable la saisie semi-automatique du navigateur sur tous les navigateurs, et lorsque l'interface indique "écrire la date au format mm/jj/aaaa" et que le champ contient aaaa-mm, les utilisateurs peuvent être confus - jj ( Quel format dois-je utiliser ? Quel format est correct ? Que faut-il écrire dans le champ maintenant ou que donner comme instructions ?)

La saisie du type de date éliminera tous les tracas, que vous le vouliez ou non, c'est ma dernière suggestion. Nous pouvons nous attendre à ce que l’accessibilité et l’assistance s’améliorent au fil du temps sans aucune action de votre part. La saisie des dates s'est beaucoup améliorée depuis son introduction il y a quelques années. Oubliez les designs au pixel près. Utilisez des normes dans la mesure du possible.

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal