Home > Web Front-end > HTML Tutorial > The event onreset triggered after the html form is reset

The event onreset triggered after the html form is reset

黄舟
Release: 2017-11-04 13:45:18
Original
4224 people have browsed it

Example

Executed when the form is resetJavaScript:

<form onreset="myFunction()">
  Enter name: <input type="text">
  <input type="reset">
</form>
Copy after login

Definition and usage

onreset EventIn the form Triggered after being reset.

Browser support

The event onreset triggered after the html form is reset

Syntax

HTML:

<element onreset="myScript">
Copy after login

JavaScript:

object.onreset=function(){myScript};
Copy after login

In JavaScript, use the addEventListener() method:

object.addEventListener("reset", myScript);
Copy after login

Note: Internet Explorer 8 and earlier IE versions do not support the addEventListener() method.

Technical Details

Whether bubbling is supported:Yes
Can be canceled :Yes
Event type:Event
Supported HTML tags:
,

更多实例

实例

在表单重置前显示写入到文本域中的内容:

var x = document.getElementById("myInput");
alert("重置前, 文本内容为: " + x.value);
Copy after login

实例

使用 HTML DOM Form Object 的 reset() 方法来重置表单。当执行后, onreset 事件被触发,并会弹出提示信息。

// 重置id="myForm"表单的所有元素值
function myResetFunction() {
    document.getElementById("myForm").reset();
}

// 在表单重置后弹出提示信息
function myAlertFunction() {
    alert("表单已重置");
}
Copy after login

实例

在本例中,当重置按钮被点击时,表单会改为默认值,并显示一个对话框:

<form onreset="alert(&#39;The form will be reset&#39;)">

Firstname: <input type="text" name="fname" value="John" />
<br />
Lastname: <input type="text" name="lname" />
<br /><br />
<input type="reset" value="Reset">

</form>
Copy after login

The above is the detailed content of The event onreset triggered after the html form is reset. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template