JavaScript 重置表单的实例分享

在用户单击重置按钮时，表单会被重置。
使用type特性值为“reset”的<input>或<button>都可以创建重置按钮。

例子：

这两个按钮都可以用来重置表单。
在重置表单时，所有表单字段都会回复到页面刚加载完毕时的初始值。
如果某个字段的初始值为空，就会恢复为空；而带有默认值的字段，也会恢复默认值
。
用户单击重置按钮重置表单时，会触发reset事件。
使用这个机会，可以在必要时取消重置操作。

例如，阻止重置表单的代码：

var EventUtil = {
    addHandler: function (element, type, handler) {
        if (element.addEventListener) {
            element.addEventListener(type, handler, false);
        } else if (element.attachEvent) {
            element.attachEvent("on" + type, handler);
        } else {
            element["on" + type] = handler;
        }
    },
    getEvent: function (event) {
        return event ? event : window.event;
    },
    preventDefault: function (event) {
        if (event.preventDefault) {
            event.preventDefault();
        } else {
            event.returnValue = false;
        }
    }

};
var form = document.getElementById("myForm");
EventUtil.addHandler(form, "reset", function () {
    //取得事件对象
    event = EventUtil.getEvent(event);
    //阻止表单重置
    EventUtil.preventDefault(event);
});

与提交表单一样，也可以通过JavaScript来重置表单，如下面的例子所示：

var form = document.getElementById("myForm");
//重置表单
form.reset();

与调用submit()方法不同，调用reset()方法会像单击重置按钮一样触发reset事件。

您可能感兴趣的文章：
JavaScript 重置表单的实例分享
JavaScript 提交表单的实例分享
jQuery form表单reset按钮重置清空表单的实现代码
如何在微信端html5页面调用分享接口
微信端h5页面如何调用分享页面的接口
php token防止表单重复提交的实例代码
微信端html5页面如何调用分享接口
JS 提交表单的小例子
解析Javascript继承机制的设计思想
js禁止回车提交表单的方法