form object
A <form> tag is a <form> object.
Properties of the form object
name: The name of the form, mainly used to let JS control the form.
action: form data processing program (PHP file).
method: form submission method, values: GET, POST
enctype: encoding method of form data.
Methods of form object
submit(): Submit the form, the same function as <input type = “submit” />.
reset(): Reset the form, which has the same function as the reset button.
Events of the form object
onsubmit: Occurs when the submit button is clicked, and occurs before the data is sent to the server. Mainly used for "form validation before form submission".
onreset: Occurs when the reset button is clicked.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>php.cn</title>
<script type="text/javascript">
window.onload = function(){
//获取form对象
var formObj = document.form1;
//增加method属性
formObj.method = "post";
//增加action属性
formObj.action = "login.php";
}
</script>
</head>
<body>
<form name="form1">
用户名：<input type="text" name="username" />
密码：<input type="password" name="userpwd" />
<input type="submit" value="提交表单" />
</form>
</body>
</html>
##Get form elements
- Get the object through the id of the web page element. document.getElementById(id)
- Get the object through the HTML tag name. parentNode.getElementsByTagName(tagName)
- Get the form element object through the name attribute. The starting point of all elements in the form must be a document object.
- Syntax: document.formObj.elementObj
- The access method is a three-tier structure. Among them, formObj represents the form object, and elementObj represents the form element object.
- Example: document.form1.username.value.length
##Event return value
The return value of the event will affect the default action of the object. For example: The default action of the <a> tag is to open a URL.
If the event returns false, the execution of the default action is prevented; if the event returns true or empty, the default action continues to be executed.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>php.cn</title>
</head>
<body>
<a href="http://www.php.cn" onclick="return false">PHP中文网</a>
</body>
</html>
There are two events affected by the return value: onclick and onsubmit.
Next Section
