Création d'une liste déroulante dans un formulaire HTML5 - Factures

Les listes déroulantes sont une fonctionnalité courante dans les pages Web, et HTML5 rend leur création assez infaillible. Les listes déroulantes vous permettent, au programmeur, de spécifier un certain nombre de choix que les visiteurs de votre site Web peuvent effectuer sans avoir à taper (une liste est affichée dans la figure). Les listes déroulantes sont particulièrement intéressantes car elles ne nécessitent pas beaucoup d'écran d'affichage - les options ne sont visibles que lorsque l'utilisateur les sélectionne.

Les listes déroulantes ont un attribut incroyablement précieux en ce qu'elles empêchent certains types d'erreurs. Les options limitées rendent la réponse très prévisible car vous prédéterminez toutes les réponses possibles. Vous n'avez pas à gérer toutes les choses folles que les utilisateurs peuvent taper dans une zone de texte.

Dans HTML5 / XHTML, les listes déroulantes sont créées par deux types d'objet. La structure globale utilise les balises, alors que chacun des choix possibles a son propre tag, comme le code pour une page web avec une liste déroulante montre:

formDemo. html

Form Demo
Sélectionner les éléments
Sélectionner la liste un deux trois quatre

La liste de sélection est une véritable centrale, vous devriez donc savoir comment faire:

1. Créez d'abord l'élément.

   Le conteneur de la liste est un élément. La liste entière est enfermée dans la paire.

2. Attribuez un ID à l'élément select .

   Vous utiliserez cet ID pour désigner l'élément dans le code.

3. Ajoute un élément option à l'élément select.

   Il est utile de mettre en retrait les options pour vous rappeler qu'elles font partie de l'objet sélectionné.

4. Attribuez une valeur à chaque option.

   La valeur est la réponse envoyée à un programme lorsque l'utilisateur choisit une option. L'utilisateur ne verra pas nécessairement la valeur.

5. Indiquez le texte que l'utilisateur verra entre les balises et .

   Cela peut être différent de la valeur ou la même chose. (Cela aura plus de sens après que vous ayez codé en JavaScript.)

6. Ajoutez autant d'options que vous le souhaitez.

   Créez un nouvel objet d'option pour chaque choix que vous souhaitez avoir dans la liste.

Les boîtes de sélection n'ont pas le pour avoir le comportement du menu déroulant. Si vous souhaitez que la zone occupe plus d'espace vertical sur la page, spécifiez simplement le nombre de lignes avec l'attribut size.