Les nouveaux types d'éléments de formulaire en HTML5 sont : 1. le type d'e-mail ; 2. le type d'URL ; 3. le type de numéro ; 5. le type de sélecteur de date (date, mois, semaine, heure, etc.) ; , type de recherche ; 7. type de couleur ; 8. type de téléphone.
L'environnement d'exploitation de ce tutoriel : système Windows 7, version HTML5, ordinateur Dell G3.
Les formulaires HTML sont utilisés pour collecter différents types de saisies utilisateur. Dans les formulaires HTML, l'élément est l'élément de formulaire le plus important. Les éléments ont de nombreuses formes. Selon différents attributs de type, les types de type dans le formulaire HTML d'origine incluent le texte, le mot de passe, la radio, la soumission, etc. Dans le nouveau HTML5, il existe plusieurs nouveaux types d'entrée de formulaire. Ces nouvelles fonctionnalités offrent un meilleur contrôle et une meilleure validation des entrées.
Cet article présentera les nouveaux types d'entrée d'éléments de formulaire suivants :
Lorsque l'attribut type est défini sur email, lors de la soumission du formulaire, il vérifiera automatiquement si la valeur du champ email est conforme au format standard de l'e-mail, et vous ne devez utiliser des expressions régulières vous-même. Je suis allé vérifier le format de l'e-mail.
Exemple
Email:<input type="email" name="useremail" />
Lorsque l'attribut type est défini sur url, lorsque le formulaire est soumis, il vérifiera automatiquement si la valeur du champ url est conforme au format standard de l'url.
Exemple
Linkpage:<input type="url" name="link_url" />
Lorsque l'attribut type est défini sur nombre, il vérifiera automatiquement si le contenu d'entrée est de type numérique. Vous pouvez également définir la limite du numéro de la zone de saisie.
Exemple
Number:<input type="number" name="user_num" min="1" max="10" />
Pour les propriétés qualifiées numériquement :
Property | Description |
---|---|
max | Spécifie la valeur maximale autorisée |
min | Spécifie ce qui est autorisé La valeur minimale de |
step | Spécifie les intervalles de numéros légaux (si step="3", les numéros légaux sont -3,0,3,6, etc.) |
value | Spécifie la valeur par défaut |
désactivé | Spécifie que le champ de saisie est désactivé |
maxlength | Spécifie la longueur maximale des caractères du champ de saisie |
pattern | Spécifie le modèle utilisé pour valider le champ de saisie |
lecture seule | Spécifie que la valeur du champ de saisie ne peut pas être modifiée |
required | Spécifie que la valeur du champ de saisie est obligatoire |
size | Spécifie les caractères visibles du champ de saisie |
Le type plage est utilisé pour les champs de saisie qui doivent contenir des valeurs numériques dans une certaine plage . Les types de plages sont affichés sous forme de curseurs. Vous pouvez également définir des limites sur les nombres acceptés.
Exemple
<input type="range" name="user_range" min="1" max="10" />
Les attributs utilisés pour qualifier les nombres sont les mêmes que les quatre premiers du type de nombre.
est utilisé pour sélectionner les dates et les heures.
Exemple
Date:<input type="date" name="user_date" />
Type de saisie pour sélectionner la date et l'heure :
est utilisé pour les champs de recherche, tels que la recherche sur site ou recherche Google (le champ de recherche se comporte comme un champ de texte ordinaire).
Exemple
Search Google:<input type="search" name="googlesearch">
Lorsque l'attribut type est défini sur color, il vérifiera automatiquement si le contenu d'entrée est au format couleur.
Exemple
Select your favorite color:<input type="color" name="favcolor">
Lorsque l'attribut type est défini sur tel, il vérifiera automatiquement si le contenu saisi est au format du numéro de téléphone.
Exemple
Telephone:<input type="tel" name="usrtel">
Recommandations associées : "Tutoriel vidéo HTML"
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!