javascript - form.reset() 是如何工作的？

Question

我知道 form.reset() 会将所有表单字段重置为其默认值，但它是如何工作的？

是浏览器的DOM实现吗？即浏览器知道在上次回发/获取中从服务器发送的最后值是什么，并且当 reset() 被调用时浏览器重置这些值。

Answer 1

DOM 规范 tells us它:

...performs the same action as a reset button.

等等 HTML。根据latest spec (仍然是草稿!):

When a form element form is reset, the user agent must fire a simple event named reset, that is cancelable, at form, and then, if that event is not canceled, must invoke the reset algorithm of each resettable element whose form owner is form, and broadcast formchange events from form.

Each resettable element defines its own reset algorithm. Changes made to form controls as part of these algorithms do not count as changes caused by the user (and thus, e.g., do not cause input events to fire).

还有 "reset algorithm" for input elements (例如)是:

...to set the dirty value flag and dirty checkedness flag back to false, set the value of the element to the value of the value content attribute, if there is one, or the empty string otherwise, set the checkedness of the element to true if the element has a checked content attribute and false if it does not, empty the list of selected files, and then invoke the value sanitization algorithm, if the type attribute's current state defines one.

基本上，reset 将输入的值设置为其“值”属性 的当前值 (theElement.getAttribute("value"))，这可能与其当前的 value property (theElement.value) 不同。 Live example here.

编辑:哦哦，Pekka 指向我们 defaultValue .非常酷，我宁愿使用它也不愿使用 getAttribute("value")。 Revised live example.