Comment fonctionne form.reset ()?

Je sais que form.reset() réinitialise tous les champs de formulaire à leurs valeurs par défaut, mais comment cela fonctionne-t-il?

Est-ce que c'est la mise en œuvre DOM du navigateur? C'est-à-dire que le navigateur sait quelles ont été les dernières valeurs envoyées par le serveur dans le dernier postback / get et lorsque reset() est appelé le navigateur réinitialise ces valeurs.

La spécification DOM nous l'indique :

… effectue la même action qu'un bouton de réinitialisation.

Et donc à HTML. Selon les dernières spécifications (encore un brouillon!):

Lorsqu'un formulaire d'élément de formulaire est réinitialisé, l'agent utilisateur doit déclencher un événement simple nommé réinitialisation, qui est annulable, sous forme, puis, si cet événement n'est pas annulé, doit invoquer l'algorithme de réinitialisation de chaque élément réinitialisable dont le formulaire est formé , Et diffuser des événements de formulaire de forme.

Chaque élément réinitialisable définit son propre algorithme de réinitialisation. Les modifications effectuées pour former des contrôles dans le cadre de ces algorithmes ne comptent pas comme des modifications provoquées par l'utilisateur (et par conséquent, par exemple, ne provoquent pas l'incendie des événements d'entrée).

Et l' algorithme de réinitialisation pour input éléments d' input (par exemple) est:

… pour régler le drapeau de la valeur suprême et le drapeau de verrues sales sur false, définissez la valeur de l'élément sur la valeur de l'attribut de contenu de la valeur, s'il y en a un, ou la chaîne vide, configurez la vérification de l'élément à True si l'élément a un attribut de contenu vérifié et s'il est faux, vide la liste des fichiers sélectionnés, puis invoquez l'algorithme de désinfection des valeurs, si l'état actuel de l'attribut de type définit un.

Donc, fondamentalement, la reset définit la valeur d'une entrée à la valeur actuelle de son attribut "valeur" ( theElement.getAttribute("value") ), qui peut être différent de sa propriété de value actuelle ( theElement.value ). Exemple en direct ici.

Edit : Oooh, Pekka nous defaultValue . Très cool, j'aimerais plutôt utiliser ça que getAttribute("value") . Exemple révisé en direct.

reset utilisera les valeurs dans le code source HTML actuel. Le navigateur ne connaît rien de la dernière demande dans cette demande (ce serait une violation de sécurité énorme).

Si le formulaire contient ces éléments:

 <form action="xyz"> <input type="text" name="fieldA" /> <input type="text" name="fieldB" value="Thingy" /> <input type="reset" value="Click me to undo everything" /> <input type="button" onclick="this.form.reset()" value="Click me too" /> </form> 

Les deux boutons vont vider le premier champ et définir la valeur du second champ sur Thingy .