Éléments de formulaires HTML

Ce chapitre décrit tous les éléments de formulaire HTML.

l'élément <input>

Le plus important des éléments de formulaire est <input> éléments.

L'élément <input> selon différents type Les attributs peuvent varier sous différentes formes.

Remarque :Le prochain chapitre explique tous les types d'entrée HTML.

L'élément <select> (liste déroulante)

<select> L'élément <select> définitListe déroulante:

Exemple

<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>

Essayer vous-même

<option> L'élément <option> définit les options à choisir.

Les listes déroulantes affichent généralement la première option comme sélectionnée.

Vous pouvez définir une option prédéfinie en ajoutant l'attribut selected.

Exemple

<option value="fiat" selected>Fiat</option>

Essayer vous-même

L'élément <textarea>

<textarea> L'élément <textarea> définit un champ d'entrée de texte en ligne multiple (Zone de texte）：

Exemple

<textarea name="message" rows="10" cols="30">
Le chat jouait dans le jardin.
</textarea>

Essayer vous-même

Le code HTML suivant s'affiche dans le navigateur :

Le chat jouait dans le jardin.

L'élément <button>

<button> L'élément <button> définit un élément cliquableBouton:

Exemple

<button type="button" onclick="alert('Hello World!')">Cliquez-moi !</button>

Essayer vous-même

Le code HTML suivant s'affiche dans le navigateur :

Éléments de formulaire HTML5

HTML5 ajoute les éléments de formulaire suivants :

  • <datalist>
  • <keygen>
  • <output>

Remarque :Par défaut, les navigateurs ne montrent pas les éléments inconnus. Les nouveaux éléments ne détruiront pas votre page.

Élément <datalist> HTML5

<datalist> L'élément <datalist> spécifie une liste d'options prédéfinies pour l'élément <input>.

L'utilisateur verra une liste déroulante des options prédéfinies apparaître lors de la saisie de données.

de l'élément <input> : list L'attribut doit faire référence à l'élément <datalist> : id Attributs.

Exemple

Définir des valeurs prédéfinies pour l'élément <input> via <datalist> :

<form action="action_page.php">
<input list="browsers">
<datalist id="browsers">
   <option value="Internet Explorer">
   <option value="Firefox">
   <option value="Chrome">
   <option value="Opera">
   <option value="Safari">
</datalist> 
</form>

Essayer vous-même