Introduction détaillée aux formulaires HTML

Les formulaires HTML sont utilisés pour collecter différents types de saisies utilisateur. L'entrée HTML5, avec plusieurs nouveaux types d'entrée de formulaire, offre un meilleur contrôle et une meilleure validation des entrées.

Formulaire

Modifier

Un formulaire est une zone qui contient des éléments de formulaire.

Les éléments de formulaire sont des éléments qui permettent aux utilisateurs de saisir des informations dans un formulaire (tels que des champs de texte, des listes déroulantes, des boutons radio, des cases à cocher, etc.).

Les formulaires sont définis à l'aide de la balise form (

).

Type d'entrée

Modifier

HTML5 propose plusieurs nouveaux types de saisie de formulaire. Ces nouvelles fonctionnalités offrent un meilleur contrôle et une meilleure validation des entrées.

1.Type d'entrée - e-mail

le type d'e-mail est utilisé pour les champs de saisie qui doivent contenir des adresses e-mail. Lors de la soumission du formulaire, la valeur du champ email sera automatiquement vérifiée.

2.Type d'entrée - url

le type d'url est utilisé pour les champs de saisie qui doivent contenir des adresses URL. Lors de la soumission du formulaire, la valeur du champ URL est automatiquement vérifiée.

3.Type de saisie - nombre

Le type de nombre est utilisé pour les champs de saisie qui doivent contenir des valeurs numériques. Vous pouvez également définir des limites sur les nombres acceptés :

4.Type d'entrée - plage

le type de plage est utilisé lorsqu'un certain champ de saisie pour valeurs numériques dans la plage.

Le type de plage est affiché sous forme de curseur.

Vous pouvez également définir des limites sur les nombres acceptés :

5.Type d'entrée - Date Sélecteurs (vérificateur de données)

HTML5 propose plusieurs nouveaux types de saisie pour sélectionner les dates et les heures :

date - sélectionne le jour, le mois, l'année

mois - sélectionne le mois, l'année

semaine - sélectionne la semaine et année

heure - Sélectionnez l'heure (heures et minutes)

datetime - Sélectionnez l'heure, le jour, le mois, l'année (heure UTC)

dateheure- local - sélectionnez l'heure, le jour, le mois, l'année (heure locale)

6.Type d'entrée - recherche

le type de recherche est utilisé Recherchez le domaine, tel que la recherche sur site ou la recherche Google.

Le champ de recherche apparaît comme un champ de texte normal.

Entrée

Modifier

La balise form utilisée dans la plupart des cas est la balise input ( ). Les types d'entrée sont définis par l'attribut type (type). Les types de saisie les plus couramment utilisés sont les suivants :

Champ de texte

Le texte est utilisé lorsque les utilisateurs souhaitent saisir des lettres, des chiffres, etc. dans des champs de formulaire (champs de texte ).

<form>
First name: <input type="text" name="firstname" /><br />
Last name: <input type="text" name="lastname" />
</form>

Le navigateur affiche ce qui suit :

Notez que le formulaire lui-même n'est pas visible. De plus, dans la plupart des navigateurs, la largeur par défaut d'un champ de texte est de 20 caractères.

Les boutons radio sont utilisés lorsque l'utilisateur sélectionne l'un des nombreux choix proposés.

<form>
<input type="radio" name="sex" value="male"> Male
<input type="radio" name="sex" value="female"> Female
</form>

Le navigateur s'affiche comme suit :

Male
Female

Notez que vous ne pouvez en sélectionner qu'un seul.

Comme le montre la figure :

case à cocher

Lorsque l'utilisateur doit choisir parmi un certain nombre de choix donnés Lors de la sélection d'une ou plusieurs options, des cases à cocher sont utilisées.

<form>
<input type="checkbox" name="bike" />I have a bike
<br />
<input type="checkbox" name="car" />I have a car
</form>

Le navigateur s'affiche comme suit :

I have a bike
I have a car

Autres composants

Modifier Bouton

Confirmer

Lorsque l'utilisateur clique sur le bouton de confirmation (soumettre), le contenu du formulaire sera transféré vers un autre fichier. [1]

Attribut d'action

L'attribut d'action (action) du formulaire définit le nom du fichier de destination. Le fichier défini par l'attribut action effectue généralement un traitement associé sur les données d'entrée reçues.

<form name="input" action="html_form_action.asp" method="get">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>

Le navigateur s'affiche comme suit :

Nom d'utilisateur :

comme indiqué ci-dessous :

Si vous sont ci-dessus Tapez quelques lettres dans la zone de texte et cliquez sur le bouton de confirmation, les données saisies seront alors envoyées à la page nommée "html_form_action.asp". Cette page affichera les résultats de votre participation.

Balises de formulaire

[Recommandations associées]

1 Tutoriel vidéo HTML gratuit

2. Explication détaillée du processus de travail du formulaire

3 Explication détaillée de l'attribut méthode dans la balise form

4.

Vous amène à maîtriser les formulaires de tableau et de formulaire en HTML

5

Explication détaillée des paramètres et attributs du formulaire de formulaire en 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!