超强常用的表单验证js代码以及函数+实例解释

<title>表单验证类 Validator v1.01</title>
<style>
body,td{font:normal 12px Verdana;color:#333333}
input,textarea,select,td{font:normal 12px Verdana;color:#333333;border:1px solid #999999;background:#ffffff}
table{border-collapse:collapse;}
td{padding:3px}
input{height:20;}
textarea{width:80%;height:50px;overfmin:auto;}
form{display:inline}
</style>
<table align="center">
<form name="theForm" id="demo" action="" method="get" onSubmit="return Validator.Validate(this,2)">
    <tr>
   <td>真实姓名：</td><td><input name="Name" dataType="Chinese" msg="真实姓名只允许中文"></td>
</tr>
<tr>
   <td>英文名：</td><td><input name="Nick" dataType="English" require="false" msg="英文名只允许英文字母"></td>
</tr>
    <tr>
   <td>主页：</td><td><input name="Homepage" require="false" dataType="Url"   msg="非法的Url"></td>
</tr>
<tr>
   <td>密码：</td><td><input name="Password" dataType="SafeString"   msg="密码不符合安全规则" type="password"></td>
</tr>
<tr>
   <td>重复：</td><td><input name="Repeat" dataType="Repeat" to="Password" msg="两次输入的密码不一致" type="password"></td>
</tr>
<tr>
   <td>信箱：</td><td><input name="Email" dataType="Email" msg="信箱格式不正确"></td>
</tr>
    <tr>
   <td>信箱：</td><td><input name="Email" dataType="Repeat" to="Email" msg="两次输入的信箱不一致"></td>
</tr>
<tr>
   <td>QQ：</td><td><input name="QQ" require="false" dataType="QQ" msg="QQ号码不存在"></td>
</tr>
    <tr>
   <td>身份证：</td><td><input name="Card" dataType="IdCard" msg="身份证号码不正确"></td>
</tr>
<tr>
   <td>年龄：</td><td><input name="Year" dataType="Range" msg="年龄必须在18~28之间" min="18" max="28"></td>
</tr>
   <tr>
   <td>年龄1：</td><td><input name="Year1" require="false" dataType="Compare" msg="年龄必须在18以上" to="18" operator="GreaterThanEqual"></td>
</tr>
   <tr>
   <td>电话：</td><td><input name="Phone" require="false" dataType="Phone" msg="电话号码不正确"></td>
</tr>
   <tr>
   <td>手机：</td><td><input name="Mobile" require="false" dataType="Mobile" msg="手机号码不正确"></td>
</tr>
     <tr>
   <td>生日：</td><td><input name="Birthday" dataType="Date" format="ymd" msg="生日日期不存在"></td>
</tr>
   <tr>
   <td>邮政编码：</td><td><input name="Zip" dataType="Custom" regexp="^[1-9]\d{5}$" msg="邮政编码不存在"></td>
</tr>
<tr>
   <td>邮政编码：</td><td><input name="Zip1" dataType="Zip" msg="邮政编码不存在"></td>
</tr>
<tr>
   <td>操作系统：</td><td><select name="Operation" dataType="Require" msg="未选择所用操作系统" ><option value="">选择您所用的操作系统</option><option value="Win98">Win98</option><option value="Win2k">Win2k</option><option value="WinXP">WinXP</option></select></td>
</tr>
<tr>
   <td>所在省份：</td><td>广东<input name="Province" value="1" type="radio">陕西<input name="Province" value="2" type="radio">浙江<input name="Province" value="3" type="radio">江西<input name="Province" value="4" type="radio" dataType="Group" msg="必须选定一个省份" ></td>
</tr>
<tr>
   <td>爱好：</td><td>运动<input name="Favorite" value="1" type="checkbox">上网<input name="Favorite" value="2" type="checkbox">听音乐<input name="Favorite" value="3" type="checkbox">看书<input name="Favorite" value="4" type="checkbox"" dataType="Group" min="2" max="3" msg="必须选择2~3种爱好"></td>
</tr>
   <td>自我介绍：</td><td><textarea name="Description" dataType="Limit" max="10" msg="自我介绍内容必须在10个字之内">中文是一个字</textarea></td>
</tr>
     <td>自传：</td><td><textarea name="History" dataType="LimitB" min="3" max="10" msg="自传内容必须在[3,10]个字节之内">中文是两个字节t</textarea></td>
</tr>
<tr>
   <td colspan="2"><input name="Submit" type="submit" value="确定提交"><input onClick="Validator.Validate(document.getElementByIdx('demo'))" value="检验模式1" type="button"><input onClick="Validator.Validate(document.getElementByIdx('demo'),2)" value="检验模式2" type="button"><input onClick="Validator.Validate(document.getElementByIdx('demo'),3)" value="检验模式3" type="button"></td>
</tr>
</form>
</table>
<script>

Validator = {
Require : /.+/,
Email : /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/,
Phone : /^((\(\d{3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}$/,
Mobile : /^((\(\d{3}\))|(\d{3}\-))?13\d{9}$/,
Url : /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/,
IdCard : /^\d{15}(\d{2}[A-Za-z0-9])?$/,
Currency : /^\d+(\.\d+)?$/,
Number : /^\d+$/,
Zip : /^[1-9]\d{5}$/,
QQ : /^[1-9]\d{4,8}$/,
Integer : /^[-\+]?\d+$/,
Double : /^[-\+]?\d+(\.\d+)?$/,
English : /^[A-Za-z]+$/,
Chinese : /^[\u0391-\uFFE5]+$/,
UnSafe : /^(([A-Z]*|[a-z]*|\d*|[-_\~!@#\$%\^&\*\.\(\)\[\]\{\}<>\?\\\/\'\"]*)|.{0,5})$|\s/,
IsSafe : function(str){return !this.UnSafe.test(str);},
SafeString : "this.IsSafe(value)",
Limit : "this.limit(value.length,getAttribute('min'), getAttribute('max'))",
LimitB : "this.limit(this.LenB(value), getAttribute('min'), getAttribute('max'))",
Date : "this.IsDate(value, getAttribute('min'), getAttribute('format'))",
Repeat : "value == document.getElementsByName(getAttribute('to'))[0].value",
Range : "getAttribute('min') < value && value < getAttribute('max')",
Compare : "this.compare(value,getAttribute('operator'),getAttribute('to'))",
Custom : "this.Exec(value, getAttribute('regexp'))",
Group : "this.MustChecked(getAttribute('name'), getAttribute('min'), getAttribute('max'))",
ErrorItem : [document.forms[0]],
ErrorMessage : ["以下原因导致提交失败：\t\t\t\t"],
Validate : function(theForm, mode){
var obj = theForm || event.srcElement;
var count = obj.elements.length;
this.ErrorMessage.length = 1;
this.ErrorItem.length = 1;
this.ErrorItem[0] = obj;
for(var i=0;i<count;i++){
   with(obj.elements[i]){
    var _dataType = getAttribute("dataType");
    if(typeof(_dataType) == "object" || typeof(this[_dataType]) == "undefined") continue;
    this.ClearState(obj.elements[i]);
    if(getAttribute("require") == "false" && value == "") continue;
    switch(_dataType){
     case "Date" :
     case "Repeat" :
     case "Range" :
     case "Compare" :
     case "Custom" :
     case "Group" :
     case "Limit" :
     case "LimitB" :
     case "SafeString" :
      if(!eval_r(this[_dataType])) {
       this.AddError(i, getAttribute("msg"));
      }
      break;
     default :
      if(!this[_dataType].test(value)){
       this.AddError(i, getAttribute("msg"));
      }
      break;
    }
   }
}
if(this.ErrorMessage.length > 1){
   mode = mode || 1;
   var errCount = this.ErrorItem.length;
   switch(mode){
   case 2 :
    for(var i=1;i<errCount;i++)
     this.ErrorItem[i].style.color = "red";
   case 1 :
    alert(this.ErrorMessage.join("\n"));
    this.ErrorItem[1].focus();
    break;
   case 3 :
    for(var i=1;i<errCount;i++){
    try{
     var span = document.createElement("SPAN");
     span.id = "__ErrorMessagePanel";
     span.style.color = "red";
     this.ErrorItem[i].parentNode.appendChild(span);
     span.innerHTML = this.ErrorMessage[i].replace(/\d+:/,"*");
     }
     catch(e){alert(e.description);}
    }
    this.ErrorItem[1].focus();
    break;
   default :
    alert(this.ErrorMessage.join("\n"));
    break;
   }
   return false;
}
return true;
},
limit : function(len,min, max){
min = min || 0;
max = max || Number.MAX_VALUE;
return min <= len && len <= max;
},
LenB : function(str){
return str.replace(/[^\x00-\xff]/g,"**").length;
},
ClearState : function(elem){
with(elem){
   if(style.color == "red")
    style.color = "";
   var lastNode = parentNode.childNodes[parentNode.childNodes.length-1];
   if(lastNode.id == "__ErrorMessagePanel")
    parentNode.removeChild(lastNode);
}
},
AddError : function(index, str){
this.ErrorItem[this.ErrorItem.length] = this.ErrorItem[0].elements[index];
this.ErrorMessage[this.ErrorMessage.length] = this.ErrorMessage.length + ":" + str;
},
Exec : function(op, reg){
return new RegExp(reg,"g").test(op);
},
compare : function(op1,operator,op2){
switch (operator) {
   case "NotEqual":
    return (op1 != op2);
   case "GreaterThan":
    return (op1 > op2);
   case "GreaterThanEqual":
    return (op1 >= op2);
   case "LessThan":
    return (op1 < op2);
   case "LessThanEqual":
    return (op1 <= op2);
   default:
    return (op1 == op2);          
}
},
MustChecked : function(name, min, max){
var groups = document.getElementsByName(name);
var hasChecked = 0;
min = min || 1;
max = max || groups.length;
for(var i=groups.length-1;i>=0;i--)
   if(groups[i].checked) hasChecked++;
return min <= hasChecked && hasChecked <= max;
},
IsDate : function(op, formatString){
formatString = formatString || "ymd";
var m, year, month, day;
switch(formatString){
   case "ymd" :
    m = op.match(new RegExp("^(("));
    if(m == null ) return false;
    day = m[6];
    month = m[5]--;
    year = (m[2].length == 4) ? m[2] : GetFullYear(parseInt(m[3], 10));
    break;
   case "dmy" :
    m = op.match(new RegExp("^("));
    if(m == null ) return false;
    day = m[1];
    month = m[3]--;
    year = (m[5].length == 4) ? m[5] : GetFullYear(parseInt(m[6], 10));
    break;
   default :
    break;
}
if(!parseInt(month)) return false;
month = month==12 ?0:month;
var date = new Date(year, month, day);
        return (typeof(date) == "object" && year == date.getFullYear() && month == date.getMonth() && day == date.getDate());
function GetFullYear(y){return ((y<30 ? "20" : "19") + y)|0;}
}
}
</script>

-------------------------------------------------------------------------------------------------------------

常用表单验证JS
目录:
1:js 字符串长度限制、判断字符长度 、js限制输入、限制不能输入、textarea 长度限制
2.:js判断汉字、判断是否汉字 、只能输入汉字
3:js判断是否输入英文、只能输入英文
4:js只能输入数字,判断数字、验证数字、检测数字、判断是否为数字、只能输入数字
5:只能输入英文字符和数字
6: js email验证 、js 判断email 、信箱/邮箱格式验证
7:js字符过滤,屏蔽关键字
8:js密码验证、判断密码
2.1: js 不为空、为空或不是对象 、判断为空 、判断不为空
2.2:比较两个表单项的值是否相同
2.3:表单只能为数字和"_",
2.4:表单项输入数值/长度限定
2.5:中文/英文/数字/邮件地址合法性判断
2.6:限定表单项不能输入的字符
2.7表单的自符控制
2.8:form文本域的通用校验函数

1. 长度限制
<script>
function test()
{
if(document.a.b.value.length>50)
{
alert("不能超过50个字符！");
document.a.b.focus();
return false;
}
}
</script>
<form name=a onsubmit="return test()">
<textarea name="b" cols="40" wrap="VIRTUAL" rows="6"></textarea>
<input type="submit" name="Submit" value="check">
</form>

2. 只能是汉字
<input onkeyup="value="/oblog/value.replace(/[^\u4E00-\u9FA5]/g,'')">

3." 只能是英文
<script language=javascript>
function onlyEng()
{
if(!(event.keyCode>=65&amp;&amp;event.keyCode<=90))
event.returnvalue=false;
}
</script>

<input onkeydown="onlyEng();">

4. 只能是数字
<script language=javascript>
function onlyNum()
{
if(!((event.keyCode>=48&amp;&amp;event.keyCode<=57)||(event.keyCode>=96&amp;&amp;event.keyCode<=105)))
//考虑小键盘上的数字键
event.returnvalue=false;
}
</script>

<input onkeydown="onlyNum();">

5. 只能是英文字符和数字
<input onkeyup="value="/oblog/value.replace(/[\W]/g,"'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))">

6. 验证油箱格式
<SCRIPT LANGUAGE=javascript RUNAT=Server>
function isEmail(strEmail) {
if (strEmail.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1)
return true;
else
alert("oh");
}
</SCRIPT>
<input type=text onblur=isEmail(this.value)>

7. 屏蔽关键字(这里屏蔽***和****)
<script language="javascript1.2">
function test() {
if((a.b.value.indexOf ("***") == 0)||(a.b.value.indexOf ("****") == 0)){
alert(":)");
a.b.focus();
return false;}
}
</script>
<form name=a onsubmit="return test()">
<input type=text name=b>
<input type="submit" name="Submit" value="check">
</form>

8. 两次输入密码是否相同
<FORM METHOD=POST ACTION="">
<input type="password" id="input1">
<input type="password" id="input2">
<input type="button" value="test" onclick="check()">
</FORM>
<script>
function check()
{
with(document.all){
if(input1.value!=input2.value)
{
alert("false")
input1.value = "";
input2.value = "";
}
else document.forms[0].submit();
}
}
</script>
够了吧
屏蔽右键 很酷
oncontextmenu="return false" ondragstart="return false" onselectstart="return false"
加在body中


二

2.1 表单项不能为空

<script language="javascript">
<!--
function CheckForm()
{  
if (document.form.name.value.length == 0) {  
alert("请输入您姓名!");
document.form.name.focus();
return false;
}
return true;
}
-->
</script>

2.2 比较两个表单项的值是否相同

<script language="javascript">
<!--
function CheckForm()
if (document.form.PWD.value != document.form.PWD_Again.value) {  
alert("您两次输入的密码不一样！请重新输入.");
document.ADDUser.PWD.focus();
return false;
}
return true;
}
-->
</script>

2.3 表单项只能为数字和"_",用于电话/银行帐号验证上,可扩展到域名注册等

<script language="javascript">
<!--
function isNumber(String)
{  
var Letters = "1234567890-"; //可以自己增加可输入值
var i;
var c;
if(String.charAt( 0 )=='-')
return false;
if( String.charAt( String.length - 1 ) == '-' )
return false;
for( i = 0; i < String.length; i ++ )
{  
c = String.charAt( i );
if (Letters.indexOf( c ) < 0)
return false;
}
return true;
}
function CheckForm()
{  
if(! isNumber(document.form.TEL.value)) {  
alert("您的电话号码不合法！");
document.form.TEL.focus();
return false;
}
return true;
}
-->
</script>


2.4 表单项输入数值/长度限定

<script language="javascript">
<!--
function CheckForm()  
{  
if (document.form.count.value > 100 || document.form.count.value < 1)
{  
alert("输入数值不能小于零大于100!");
document.form.count.focus();
return false;
}
if (document.form.MESSAGE.value.length<10)
{  
alert("输入文字小于10!");
document.form.MESSAGE.focus();
return false;
}
return true;
}
//-->
</script>

2.5 中文/英文/数字/邮件地址合法性判断

<SCRIPT LANGUAGE="javascript">
<!--

function isEnglish(name) //英文值检测
{  
if(name.length == 0)
return false;
for(i = 0; i < name.length; i++) {  
if(name.charCodeAt(i) > 128)
return false;
}
return true;
}

function isChinese(name) //中文值检测
{  
if(name.length == 0)
return false;
for(i = 0; i < name.length; i++) {  
if(name.charCodeAt(i) > 128)
return true;
}
return false;
}

function isMail(name) // E-mail值检测
{  
if(! isEnglish(name))
return false;
i = name.indexOf(" at ");
j = name dot lastIndexOf(" at ");
if(i == -1)
return false;
if(i != j)
return false;
if(i == name dot length)
return false;
return true;
}

function isNumber(name) //数值检测
{  
if(name.length == 0)
return false;
for(i = 0; i < name.length; i++) {  
if(name.charAt(i) < "0" || name.charAt(i) > "9")
return false;
}
return true;
}

function CheckForm()
{  
if(! isMail(form.Email.value)) {  
alert("您的电子邮件不合法！");
form.Email.focus();
return false;
}
if(! isEnglish(form.name.value)) {  
alert("英文名不合法！");
form.name.focus();
return false;
}
if(! isChinese(form.cnname.value)) {  
alert("中文名不合法！");
form.cnname.focus();
return false;
}
if(! isNumber(form.PublicZipCode.value)) {  
alert("邮政编码不合法！");
form.PublicZipCode.focus();
return false;
}
return true;
}
//-->
</SCRIPT>

2.6 限定表单项不能输入的字符

<script language="javascript">
<!--

function contain(str,charset)// 字符串包含测试函数
{  
var i;
for(i=0;i<charset.length;i++)
if(str.indexOf(charset.charAt(i))>=0)
return true;
return false;
}

function CheckForm()
{  
if ((contain(document.form.NAME.value, "%\(\)><")) || (contain(document.form.MESSAGE.value, "%\(\)><")))
{  
alert("输入了非法字符");
document.form.NAME.focus();
return false;
}
return true;
}
//-->
</script> 

1. 检查一段字符串是否全由数字组成      
---------------------------------------      
<script language="Javascript"><!--          
function checkNum(str){return str.match(/\D/)==null}          
alert(checkNum("1232142141"))          
alert(checkNum("123214214a1"))          
// --></script>        
      
2. 怎么判断是否是字符        
---------------------------------------      
if (/[^\x00-\xff]/g.test(s)) alert("含有汉字");          
else alert("全是字符");      
          
3. 怎么判断是否含有汉字        
---------------------------------------        
if (escape(str).indexOf("%u")!=-1) alert("含有汉字");        
else alert("全是字符");          
    
4. 邮箱格式验证    
---------------------------------------      
//函数名：chkemail    
//功能介绍：检查是否为Email Address    
//参数说明：要检查的字符串    
//返回值：0：不是 1：是    
function chkemail(a)    
{ var i=a.length;    
var temp = a.indexOf('@');    
var tempd = a.indexOf('.');    
if (temp > 1) {    
if ((i-temp) > 3){    
if ((i-tempd)>0){    
return 1;    
}    
    
}    
}    
return 0;    
}    
    
5. 数字格式验证    
---------------------------------------      
//函数名：fucCheckNUM    
//功能介绍：检查是否为数字    
//参数说明：要检查的数字    
//返回值：1为是数字，0为不是数字    
function fucCheckNUM(NUM)    
{    
var i,j,strTemp;    
strTemp="0123456789";    
if ( NUM.length== 0)    
return 0    
for (i=0;i<NUM.length;i++)    
{    
j=strTemp.indexOf(NUM.charAt(i));    
if (j==-1)    
{    
//说明有字符不是数字    
return 0;    
}    
}    
//说明是数字    
return 1;    
}    
    
6. 电话号码格式验证    
---------------------------------------      
//函数名：fucCheckTEL    
//功能介绍：检查是否为电话号码    
//参数说明：要检查的字符串    
//返回值：1为是合法，0为不合法    
function fucCheckTEL(TEL)    
{    
var i,j,strTemp;    
strTemp="0123456789-()# ";    
for (i=0;i<TEL.length;i++)    
{    
j=strTemp.indexOf(TEL.charAt(i));    
if (j==-1)    
{    
//说明有字符不合法    
return 0;    
}    
}    
//说明合法    
return 1;    
}    
  
7. 判断输入是否为中文的函数  
---------------------------------------      
function ischinese(s){  
var ret=true;  
for(var i=0;i<s.length;i++)  
ret=ret &amp;&amp; (s.charCodeAt(i)>=10000);  
return ret;  
}    
  
8. 综合的判断用户输入的合法性的函数  
---------------------------------------      
<script language="javascript">  
//限制输入字符的位数开始  
//m是用户输入，n是要限制的位数  
function issmall(m,n)  
{  
if ((m<n) &amp;&amp; (m>0))  
{  
return(false);  
}  
else  
{return(true);}  
}  
  
9. 判断密码是否输入一致  
---------------------------------------      
function issame(str1,str2)  
{  
if (str1==str2)  
{return(true);}  
else  
{return(false);}  
}  
  
10. 判断用户名是否为数字字母下滑线
---------------------------------------      
function notchinese(str){
var reg=/[^A-Za-z0-9_]/g
    if (reg.test(str)){
    return (false);
    }else{
return(true);    }
}

2.8. form文本域的通用校验函数
---------------------------------------      
作用：检测所有必须非空的input文本，比如姓名，账号，邮件地址等等。
该校验现在只针对文本域，如果要针对form里面的其他域对象，可以改变判断条件。

使用方法：在要检测的文本域中加入title文字。文字是在提示信息，你要提示给用户的该字段的中文名。比如要检测用户名
html如下<input name="txt_1" title="姓名">,当然，最好用可视化工具比如dreamweaver什么的来编辑域。
如果要检测数字类型数据的话，再把域的id统一为sz.
javascript判断日期类型比较麻烦，所以就没有做日期类型校验的程序了.高手可以补充。

程序比较草，只是提供一个思路。抛砖引玉！ ：）
哦，对了，函数调用方法：< form onsubmit="return dovalidate()">

function dovalidate()
{
fm=document.forms[0] //只检测一个form,如果是多个可以改变判断条件
    for(i=0;i<fm.length;i++)
    {  
    //检测判断条件，根据类型不同可以修改
    if(fm[i].tagName.toUpperCase()=="INPUT" &amp;&amp;fm[i].type.toUpperCase()=="TEXT" &amp;&amp; (fm[i].title!=""))
    
         if(fm[i].value="/blog/="")//
         {
         str_warn1=fm[i].title+"不能为空!";
         alert(str_warn1);
        fm[i].focus();
         return false;        
         }
         if(fm[i].id.toUpperCase()=="SZ")//数字校验
         {
                 if(isNaN(fm[i].value))
                { str_warn2=fm[i].title+"格式不对";
                alert(str_warn2);
                fm[i].focus();
                 return false;
                 }
        }
    }
    return true;
}