JavaScript重置表单的实现

JavaScript重置表单的实现

　　如何实现表单的重置呢?下面是小编提供给大家的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重置表单的实现】相关文章：