HTML form submission method case study
|
To summarize the form submission method: 1. Use the submit button to submit. When you click the submit button, the onclick event is triggered. The function in JavaScript determines whether the input content is empty. If it is empty, it returns false and does not submit. If it is not empty, it submits to the address specified by action.
<script type="text/javascript">
function check(form) {
if(form.userId.value=='') {
alert("Please enter your user account!");
form.userId.focus();
return false;
}
if(form.password.value==''){
alert("Please enter your login password!");
form.password.focus();
return false;
}
return true;
}
</script>
<form action="login.do?act=login" method="post">
User Account<input type=text name="userId" size="18" value="" ><br>
Login password<input type="password" name="password" size="19" value=""/>
<input type=submit name="submit1" value="Login" onclick="return check(this.form)">
</form>2. Use a button to submit. When you click the button, the onclick event is triggered. The function in JavaScript determines whether the input content is empty. If it is empty, it returns false and does not submit. If it is not empty, it submits to the address specified by the action. Since the button does not have the function of automatic submission, submission is implemented by JavaScript.
<script type="text/javascript">
function check(form) {
if(form.userId.value=='') {
alert("Please enter your user account!");
form.userId.focus();
return false;
}
if(form.password.value==''){
alert("Please enter your login password!");
form.password.focus();
return false;
}
document.myform.submit();
}
</script>
<form action="login.do?act=login" name="myform" method="post">
User Account<input type=text name="userId" size="18" value="" ><br>
Login password<input type="password" name="password" size="19" value=""/>
<input type=button name="submit1" value="Login" onclick="check(this.form)">
</form>3. Use the submit button to implement submission. When the submit button is clicked, the onsubmit event is triggered first. The function in JavaScript determines whether the input content is empty. If it is empty, it returns false and does not submit. If it is not empty, it submits to the address specified by action.
<script type="text/javascript">
function check(form) {
if(form.userId.value=='') {
alert("Please enter your user account!");
form.userId.focus();
return false;
}
if(form.password.value==''){
alert("Please enter your login password!");
form.password.focus();
return false;
}
return true;
}
</script>
<form action="login.do?act=login" method="post" onsubmit="return check(this)">
User Account<input type=text name="userId" size="18" value="" ><br>
Login password<input type="password" name="password" size="19" value=""/>
<input type=submit name="submit1" value="Login">
</form>The above are the three common ways to submit forms. If you have any questions, please feel free to contact me on QQ: 317856821 This is the end of this article about the detailed case study of HTML form submission method. For more relevant HTML form submission content, please search for previous articles on 123WORDPRESS.COM or continue to browse the related articles below. I hope everyone will support 123WORDPRESS.COM in the future! You may also be interested in:
|
<<: Analysis of MySQL cumulative aggregation principle and usage examples
Recommend
Detailed explanation of mysql partition function and example analysis
First, what is database partitioning? I wrote an ...
Example of using store in vue3 to record scroll position
Table of contents Overall Effect Listen for conta...
Docker implements MariaDB sub-library and sub-table and read-write separation functions
Table of contents 1. Introduction 2. Environmenta...
Introduction to local components in Vue
In Vue, we can define (register) local components...
HTML implementation of a simple calculator with detailed ideas
Copy code The code is as follows: <!DOCTYPE ht...
MySQL Index Detailed Explanation
Table of contents 1. Index Basics 1.1 Introductio...
How to use node to implement static file caching
Table of contents cache Cache location classifica...
A brief analysis of React Native startReactApplication method
In this article, we sorted out the startup proces...
JavaScript implements the most complete code analysis of a simple magnifying glass (ES5)
This article shares the specific code of JavaScri...
The effect of zooming in on a Taobao store is similar to the principle of using a slideshow.
Today I got familiar with the mouse zooming effect...
How to change the CentOS server time to Beijing time
1. I purchased a VPS and CentOS system, and found...
Set the width of the table to be fixed so that it does not change with the text
After setting the table width in the page to width...
Detailed explanation of creating a view (CREATE VIEW) and usage restrictions in MySQL
This article uses examples to describe the creati...
Introduction and use of Javascript generator
What is a generator? A generator is some code tha...
Docker advanced method of rapid expansion
1. Command method Run the nginx service in the cr...