Balise XHTML 1.1/HTML 2.0 <input>

Description de la balise <input>

contrôle de formulaire
Le type de contrôle dépend de la valeur de type :

  • text : boîte de saisie de texte d'une seule ligne

  • password : boîte de saisie de texte de type "mot de passe". Les caractères tapés sont remplacés par des "*". Aucun cryptage n'est associé à cette protection purement visuelle.

  • checkbox : case à cocher. Les cases cochées se voient affectées un attribut "checked". Seules les contrôles ayant l'attribut checked sont envoyées au serveur. checked préselectionne ce contrôle.

  • radio : bouton radio. Similaires à checkbox mais les boutons radio qui partagent le même nom de contrôle s'excluent mutuellement. Seule la valeur cochée est envoyée au serveur. checked préselectionne ce contrôle.

  • submit : bouton standard qui déclenche l'envoi du formulaire à l'adresse indiquée dans form. Il peut y avoir plusieurs boutons submit dans un formulaire.

  • reset : bouton standard qui réinitialise le formulaire, c'est-à-dire remet les valeurs dar défaut de chacun des contrôles. A utiliser avec précaution : si l'utilisateur clique sur ce bouton au lieu du bouton submit, il devra resaisir tout son formulaire. De plus, le texte à afficher dans le bouton est rarement clair : effacer, réinitialiser, initialiser, raz, recommencer... pas évident. Certains auteurs recommandent de ne pas utiliser ce bouton.

  • file : affiche une boîte de saisie et un bouton "parcourir" pour permettre à l'utilisateur de sélectionner un fichier à envoyer au serveur. Attention à placer les bonnes valeurs dans form pour enctype et method.

  • hidden : crée un bouton invisible. Utile pour passer des valeurs d'une page à l'autre sans que l'utilisateur ne le voit.

  • image : crée un bouton submit graphique. src indique l'URL de l'image, alt affiche un texte alternatif pour les navigateurs qui n'affichent pas les images. Quand le formulaire est envoyé, le navigateur envoie également name.x=x-value et name.y=y-value où "name" est la valeur de name et x-value et y-value sont respectivement les coordonnées x,y du point où l'utilisateur a cliqué sur l'image. C'est intéressant, mais attention aux utilisateurs qui n'affichent pas les images. Utilisez plutôt plusieurs boutons submit, éventuellement sous forme image.

  • button : bouton standard. Il ne fait rien sauf s'il y a un script côté client associé.


A partir de ns 3 - ie 3
Peut contenir : rien
Peut être contenu par : tout élément block, tout élément inline

Infos

  • Version HTML : depuis HTML 2.0
  • XHTML : depuis XHTML 1.1
  • Utilisation : Toujours utilisée.
  • Type : vide
  • Ouverture/fermeture : Fermeture interdite

Attributs de <input>

nomtypecasseXinfodétails
nomtypecasseXinfodétails
accept%ContentTypes;CIListe de types MIME pour le chargement d'un fichierAfficher
accesskey%Character;CNTouche d'accès clavierAfficher
alt%Text;CStexte de remplacementAfficher
checked()CICase cochéeAfficher
classCDATACSListe de classesAfficher
dir(rtl | ltr)CIDirection du texteAfficher
disabled()CIDésactivationAfficher
idIDCSIdentifiant uniqueAfficher
ismap()CIUtiliser une image cliquable côté serveurAfficher
lang%LanguageCode;CSlangue de baseAfficher
maxlengthNUMBERCNnombre maximum de caractères dans le champAfficher
nameCDATACINom du contrôleAfficher
readonly()CInon modifiableAfficher
sizeCDATACNspécifique pour chaque type de champAfficher
src%URI;CTchamp avec imageAfficher
  • Colonne 1 (nom) : Requis : Les attributs présentés de cette manière sont requis pour la balise HTML à laquelle ils s'appliquent.
  • Colonne 3 (casse) :
    • CN : La notion de sensibilité à la casse est non nécessaire (par exemple s'il s'agit d'une valeur numérique).
    • CS : La valeur est sensible à la casse. Une lettre en majuscule ne peut pas être remplacée par la même lettre en minuscule.
    • CI : La valeur n'est pas sensible à la casse.
    • CA : L'information relative à la casse se trouve dans la définition l'attribut ou de l'élément lui méme.
    • CT : L'information relative à la casse se trouve dans la définition de type.
  • Colonne 4 (X) : L'attribut ou l'élément risque de ne plus être supporté dans les prochaines versions

Evènements de <input>

nomtypecasseXinfodétails
nomtypecasseXinfodétails
onblur%Script;CTperte du focusAfficher
onchange%Script;CTmodification de la valeurAfficher
onclick%Script;CTle bouton de souris a été cliquéAfficher
ondblclick%Script;CTle bouton de souris a été double-cliquéAfficher
onfocus%Script;CTl'élément reçoit le focusAfficher
onkeydown%Script;CTune touche est enfoncéeAfficher
onkeypress%Script;CTune touche est frappéeAfficher
onkeyup%Script;CTune touche est relâchéeAfficher
onmousedown%Script;CTle bouton de souris est enfoncéAfficher
onmousemove%Script;CTmouvement de la sourisAfficher
onmouseout%Script;CTla souris vient de sortir de la zoneAfficher
onmouseover%Script;CTla souris vient d'entrer dans la zoneAfficher
onmouseup%Script;CTle bouton de souris est relâchéAfficher
onselect%Script;CTdu texte vient d'être sélectionnéAfficher
  • Colonne 1 (nom) : Requis : Les attributs présentés de cette manière sont requis pour la balise HTML à laquelle ils s'appliquent.
  • Colonne 3 (casse) :
    • CN : La notion de sensibilité à la casse est non nécessaire (par exemple s'il s'agit d'une valeur numérique).
    • CS : La valeur est sensible à la casse. Une lettre en majuscule ne peut pas être remplacée par la même lettre en minuscule.
    • CI : La valeur n'est pas sensible à la casse.
    • CA : L'information relative à la casse se trouve dans la définition l'attribut ou de l'élément lui méme.
    • CT : L'information relative à la casse se trouve dans la définition de type.
  • Colonne 4 (X) : L'attribut ou l'élément risque de ne plus être supporté dans les prochaines versions

Exemples de balises qui peuvent contenir la balise <input>

Aucune balise2

Exemples de balises que nous pouvons placer dans la balise <input>

Aucune balise1

Liste des balises

Document créé le 14/08/2006, dernière modification le 31/10/2018
Source du document imprimé : https://www.gaudry.be/xhtml-rf-input.html

L'infobrol est un site personnel dont le contenu n'engage que moi. Le texte est mis à disposition sous licence CreativeCommons(BY-NC-SA). Plus d'info sur les conditions d'utilisation et sur l'auteur.

Notes

  1.  Acucune balise enfant : Comme l'ensemble des balises n'est pas encore défini dans ces pages, un résultat vide ne signifie pas qu'il n'existe rien.

  2.  Acucune balise parent : Comme l'ensemble des balises n'est pas encore défini dans ces pages, un résultat vide ne signifie pas qu'il n'existe rien.

Table des matières Haut