Formulaires HTML5 : Élément output

L'élément <output> représente le résultat d'un calcul ou d'une sortie produite par le navigateur ou le serveur. Il accepte comme attribut : for, name, et form.

La valeur de l'attribut for  de l'élément <output> reprend les valeurs des id de chaque champ <input> ayant été utilisé pour le calcul, s'il y en a sur le document courant. Il est tout à fait possible de n'utiliser qu'un résultat d'un calcul généré côté serveur, et dans ce cas il n'y a rien à préciser.
L'attribut form  de l'<output> reprend la valeur de l'id du formulaire qui comprend les différents champs servant au calcul.

Ce dernier point est important car l'élément output n'est pas forcément enfant d'un élément form.

<form action="scripts.php" method="post" id="tva_form" onsubmit="ttc.value = ht.value * (1 + tva.value/100); return false;">
   <p>
      <label for="t_ht">Tarif HT</label>
      <input type="number" name="ht" id="t_ht"> €
   </p>
   <p>
      <label for="t_tva">TVA</label>
      <input type="number" name="tva" id="t_tva" value="19.6"> %
   </p>
   <p>
      Prix TTC : 
      <output for="t_ht t_tva" name="ttc" form="tva_form"></output> €
   </p>
   <input type="submit" value="Calculer">
</form>

Contrairement à son ami input, l'output est un élément de type inline, par défaut.

Démonstration

Compatibilité de l'élément output

Navigateurs	Versions
	Internet Explorer 9+
	Firefox 4+ Firefox Mobile (Android 4)
	Chrome 4+ Chrome Mobile Beta (Android 4)
	Opera 9+ Opera Mobile (Android 3.1)
	Safari (5+) Safari Mobile (iOS 4)
	Android Browser 3.1