Latest web development tutorials

JavaScript Tutorial

JavaScript Tutorial JavaScript Introduction JavaScript usage JavaScript Output JavaScript grammar JavaScript Statement JavaScript Notes JavaScript variable JavaScript type of data JavaScript Object JavaScript function JavaScript Scope JavaScript event JavaScript The string JavaScript Operator JavaScript Comparison JavaScript If...Else JavaScript switch JavaScript for JavaScript while JavaScript Break & Continue JavaScript typeof JavaScript Type conversion JavaScript Regular Expressions JavaScript error JavaScript debugging JavaScript Variable promotion JavaScript Strict mode JavaScript Use errors JavaScript Form validation JavaScript Keep the keyword JavaScript JSON JavaScript void JavaScript Code specification

JS function

JavaScript Function definition JavaScript Function parameter JavaScript Function call JavaScript Closure


DOM Introduction DOM HTML DOM CSS DOM event DOM EventListener DOM element

JS Advanced Tutorial

JavaScript Object JavaScript Number JavaScript String JavaScript Date JavaScript Array JavaScript Boolean JavaScript Math JavaScript RegExp Object

JS Browser BOM

JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript Pop-ups JavaScript Timing events JavaScript Cookies

JS Library

JavaScript Library JavaScript test jQuery JavaScript test Prototype

JS Examples

JavaScript Examples JavaScript Object instance JavaScript Browser object instance JavaScript HTML DOM Examples JavaScript to sum up

JS Reference Manual

JavaScript Object HTML DOM Object

JavaScript form validation

JavaScript form validation

JavaScript can be used before being sent to the server in the data on these HTML form input data validation.

Form data often need to use JavaScript to verify its correctness:

  • Verify that the form data is empty?

  • Verify whether the input is a correct email address?

  • Verify the date entered correctly?

  • Validate form input is numeric type?

Required (or mandatory) project

The following functions are used to check whether the user is required to fill in a form (or mandatory) project. If required or necessary option is empty, then a warning box will pop up, and the function's return value is false, otherwise the function's return value was true (no problem means that the data):

function validateForm()
	var x=document.forms["myForm"]["fname"].value;
	if (x==null || x=="")
		return false;

The above function is called when the form is submitted form:


<form name="myForm" action="demo-form.php" onsubmit="return validateForm()" method="post">
姓: <input type="text" name="fname">
<input type="submit" value="提交">

try it"

E-mail verification

Function checks whether the data entered meets the following basic syntax of email address.

His point is that the input data must include the @ symbol and the dot (.). Meanwhile, the @ is not the first character mail address after the @ and the need for at least a number of points:

function validateForm(){
	var x=document.forms["myForm"]["email"].value;
	var atpos=x.indexOf("@");
	var dotpos=x.lastIndexOf(".");
	if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length){
		alert("不是一个有效的 e-mail 地址");
		return false;

The following is the complete code along with HTML form:


<form name="myForm" action="demo-form.php" onsubmit="return validateForm();" method="post">
Email: <input type="text" name="email">
<input type="submit" value="提交">

try it"