<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" "HTTP://WWW.W3.ORG/TR/HTML4/LOOSE.DTD" >
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 ">
<title> Form Validation </title>
<script language= "JavaScript" >
function Check_1 (param) {//NOT NULL
if (param== "" | | Param==null) {return false;} Else{return true;}
}
function check_2 (param) {//length limit, letters 10, Chinese characters are 10
if (param.length>10) {return false;} Else{return true;}
}
function Check_3 (param) {//can only enter Chinese characters
var pattern=/^[\u4e00-\u9faf]+$/;
var flag = pattern.test (param);
if (Flag==false) {return false;} Else{return true;}
}
function Check_4 (param) {//only digits can be entered
var pattern=/^[0-9]+$/;
var flag = pattern.test (param);
if (Flag==false) {return false;} Else{return true;}
}
function Check_5 (param) {//Only numeric letter underline can be entered
var pattern=/^[0-9a-za-z_]+$/;
var flag = pattern.test (param);
if (Flag==false) {return false;} Else{return true;}
}
function Check_6 (param) {//Mailbox format verification
var pattern=/^ ([a-za-z0-9]+[_|\_|\.]?) *[a-za-z0-9]+@ ([a-za-z0-9]+[_|\_|\.]?) *[a-za-z0-9]+\. [A-za-z] {2,3}$/;
var flag = pattern.test (param);
if (Flag==false) {return false;} Else{return true;}
}
function check_7 (param) {//URL format validation
var pattern=/^ (https|http|ftp|rtsp|mms)?: \ /\/)? ([0-9a-z_!~* ' (). &=+$%-]+:)? [0-9a-z_!~* ' (). &=+$%-]+@)? (([0-9]{1,3}\.) {3} [0-9] {1,3}| ([0-9a-z_!~* ' ()-]+\.) * ([0-9a-z][0-9a-z-]{0,61})? [0-9a-z]\. [A-z] {2,6}) (: [0-9]{1,4})? ((\/?)| (\/[0-9a-z_!~* ' ().;?: @&=+$,%#-]+) +\/?) $/;
var flag = pattern.test (param);
if (Flag==false) {return false;} Else{return true;}
}
function Check () {
var Value=document.getelementbyid ("TestValue"). Value;
var result=check_7 (value); Set the name of the validation function here, I wrote check_1~check_7 seven common forms validation functions
if (Result==false) {
document.getElementById ("TestValue"). style.border= "2px solid red";
}else{
document.getElementById ("TestValue"). style.border= "2px solid green";
document.getElementById ("TestValue"). style.border= "";
}
}
</script>
<body>
<div style= "text-align:center;padding:200px 0;" >
Please enter: <input id= "TestValue" name= "class=" "type=" text "style=" width:200px;height:30px; " ></input>
<input id= "Name=" "class=" "type=" button "value=" click Verify "style=" width:70px;height:30px; "onclick=" Check () ">< /input>
</div>
</body>
