基于Jquery的标签智能验证实现代码


答案：后经过一段对Jquery的学习，Jquery的强大解决了辅助代码过多不易维护的问题。
AutoValidate.JS 
复制代码 代码如下:
 
/// <reference path="../Scripts/jquery-1.4.1-vsdoc.js" /> 
//验证方法 v1.0，创建于2010-12-9 完成2010-12-16 MR.X 制 
//修改2010-12-10、2010-12-12、2010-12-15、2010-12-16添入信息提示动画效果 
//支持 type=text type=checkbox type=radio select 标签验证 
//vld="***"必填 格式验证 
//vld="n***"选填 格式验证 
//err="***"错误显示内容 
//super="y"用<span>追加提示信息，要用y以外字母得修改同级一组验证，同级一组的标签可以在第一个标签进行super="y"属性标识，其它不用 
//len="***"长度限制，用于textarea标签 
//<input id="***" type="text" vld="***" err="***" span="***" len="***"/> 
$(function () { 
//正则匿名对象 
var strRegex = {}; 
//错误信息匿名对象 
var strError = {}; 
//正确信息匿名对象 
var strRight = {}; 
/** 参数配置 start **/ 
//非空 
strRegex.NoNull = /[^\s]+/; 
strError.NoNull = "请填写内容，如123、中国！"; 
//邮箱 
strRegex.Email = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/; 
strError.Email = "请核对邮箱格式，如china@163.com！"; 
//网址 
strRegex.Url = /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^\"\"])*$/; 
strError.Url = "请核对网址格式，如http://www.zhaoxi.net！"; 
//账号 
strRegex.An = /^([a-zA-Z0-9]|[_]){6,16}$/; 
strError.An = "请核对账号格式，如china_56！"; 
//数字 
strRegex.Math = /\d+$/; 
strError.Math = "请核对数字格式，如1234！"; 
//年龄 
strRegex.Age = /^\d{2}$/; 
strError.Age = "请核对年龄格式，10~99岁之间！"; 
//邮编 
strRegex.Post = /^[1-9]\d{5}$/; 
strError.Post = "请核对邮编格式，如150001！"; 
//电话 
strRegex.Phone = /^((\d{11})|((\d{7,8})|(\d{4}|\d{3})-(\d{7,8})|(\d{4}|\d{3})-(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1})|(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1})))$/; 
strError.Phone = "请核对电话格式，如15546503251！"; 
//身份证 
strRegex.Card = /^(([1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[X,x]))|([1-9]\d{5}[1-9]\d{1}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])(\d{3})))$/; 
strError.Card = "请核对身份证格式，如230103190001010000！"; 
//金钱 
strRegex.Price = /^([1-9]\d*|0)(\.\d+)?$/; 
strError.Price = "请核对金钱格式，如99.98！"; 
//日期 
strRegex.Date = /((^((1[8-9]\d{2})|([2-9]\d{3}))([-\/\._])(10|12|0?[13578])([-\/\._])(3[01]|[12][0-9]|0?[1-9])$)|(^((1[8-9]\d{2})|([2-9]\d{3}))([-\/\._])(11|0?[469])([-\/\._])(30|[12][0-9]|0?[1-9])$)|(^((1[8-9]\d{2})|([2-9]\d{3}))([-\/\._])(0?2)([-\/\._])(2[0-8]|1[0-9]|0?[1-9])$)|(^([2468][048]00)([-\/\._])(0?2)([-\/\._])(29)$)|(^([3579][26]00)([-\/\._])(0?2)([-\/\._])(29)$)|(^([1][89][0][48])([-\/\._])(0?2)([-\/\._])(29)$)|(^([2-9][0-9][0][48])([-\/\._])(0?2)([-\/\._])(29)$)|(^([1][89][2468][048])([-\/\._])(0?2)([-\/\._])(29)$)|(^([2-9][0-9][2468][048])([-\/\._])(0?2)([-\/\._])(29)$)|(^([1][89][13579][26])([-\/\._])(0?2)([-\/\._])(29)$)|(^([2-9][0-9][13579][26])([-\/\._])(0?2)([-\/\._])(29)$))/; 
strError.Date = "请核对日期格式，如1999.9.9、1999-9-9、1999.09.09！"; 
//时间 
strRegex.Time = /^([0-9]|[0-1][0-9]|[2][0-3])(:|：)([0-5][0-9])$/; 
strError.Time = "请核对时间格式，如23：59！"; 
strError.Length = "请核对输入信息长度，长度小于"; 
strRight.Info = "格式正确！"; //可以设置为空 
//下拉框 
strRegex.DDL = "请选择"; 
strError.DDL = "请选择选项"; 
//单个checkbox复选框 
strRegex.Check = "请选择"; 
strError.Check = "请选择选项"; 
//单个radio复选框 
strRegex.Radio = "请选择"; 
strError.Radio = "请选择选项"; 
//同级一组checkbox复选框 
strRegex.CheckGroup = "请选择"; 
strError.CheckGroup = "请选择选项"; 
//同级一组radio复选框 
strRegex.RadioGroup = "请选择"; 
strError.RadioGroup = "请选择选项"; 
//在标签后面追加信息 
var SpanError = "<span class='vldSpanErr'><img src='" + FilePath() + "images/error.gif' /></span>"; 
var SpanOk = "<span class='vldSpanRig'><img src='" + FilePath() + "images/ok.gif' /></span>"; 
/** 参数配置 end **/ 
/** Main **/ 
//文件目录，回返最顶级目录 ../ 
function FilePath() { 
var file = ""; 
var path = window.location.pathname.split('/'); 
$(path).each(function () { 
file = "../" + file; 
}); 
return file; 
} 
//页验证自检 
$("#form1 [vld]").blur(function () { 
RegexGether($(this)); 
}); 
//验证处理集合 
function RegexGether($ctrl) { 
switch ($ctrl.attr("vld")) { 
case "nonull": 
RegexNull($ctrl); 
break; 
case "age": 
RegexInputTextAll($ctrl, strRegex.Age, strError.Age); 
break; 
case "nage": 
RegexInputTextOnly($ctrl, strRegex.Age, strError.Age); 
break; 
case "date": 
RegexInputTextAll($ctrl, strRegex.Date, strError.Date); 
break; 
case "ndate": 
RegexInputTextOnly($ctrl, strRegex.Date, strError.Date); 
break; 
case "price": 
RegexInputTextAll($ctrl, strRegex.Price, strError.Price); 
break; 
case "nprice": 
RegexInputTextOnly($ctrl, strRegex.Price, strError.Price); 
break; 
case "email": 
RegexInputTextAll($ctrl, strRegex.Email, strError.Email); 
break; 
case "nemail": 
RegexInputTextOnly($ctrl, strRegex.Email, strError.Email); 
break; 
case "post": 
RegexInputTextAll($ctrl, strRegex.Post, strError.Post); 
break; 
case "npost": 
RegexInputTextOnly($ctrl, strRegex.Post, strError.Post); 
break; 
case "card": 
RegexInputTextAll($ctrl, strRegex.Card, strError.Card); 
break; 
case "ncard": 
RegexInputTextOnly($ctrl, strRegex.Card, strError.Card); 
break; 
case "time": 
RegexInputTextAll($ctrl, strRegex.Time, strError.Time); 
break; 
case "ntime": 
RegexInputTextOnly($ctrl, strRegex.Time, strError.Time); 
break; 
case "math": 
RegexInputTextAll($ctrl, strRegex.Math, strError.Math); 
break; 
case "nmath": 
RegexInputTextOnly($ctrl, strRegex.Math, strError.Math); 
break; 
case "url": 
RegexInputTextAll($ctrl, strRegex.Url, strError.Url); 
break; 
case "nurl": 
RegexInputTextOnly($ctrl, strRegex.Url, strError.Url); 
break; 
case "an": 
RegexInputTextAll($ctrl, strRegex.An, strError.An); 
break; 
case "nan": 
RegexInputTextOnly($ctrl, strRegex.An, strError.An); 
break; 
case "phone": 
RegexInputTextAll($ctrl, strRegex.Phone, strError.Phone); 
break; 
case "nphone": 
RegexInputTextOnly($ctrl, strRegex.Phone, strError.Phone); 
break; 
case "ddl": 
RegexSelect($ctrl); 
break; 
case "check": 
RegexInputCheckBoxRadioOnly($ctrl, strError.Check); 
break; 
case "radio": 
RegexInputCheckBoxRadioOnly($ctrl, strError.Radio); 
break; 
case "checkgroup": 
RegexInputCheckBoxRadioAll($ctrl, strError.CheckGroup); 
break; 
case "radiogroup": 
RegexInputCheckBoxRadioAll($ctrl, strError.RadioGroup); 
break; 
} 
} 
//标签内容空验证 
function RegexNull($ctrl) { 
if (strRegex.NoNull.test($ctrl.val())) { 
return RegexLen($ctrl); 
} 
else { 
Error($ctrl, strError.NoNull); 
return false; 
} 
} 
//验证多个同级一组input(type=radio)标签 或 input(type=checkbox)标签 
function RegexInputCheckBoxRadioAll($ctrl, error) { 
if ($ctrl.parent().children(":checked").length == 0) { 
if ($ctrl.parent().children().attr("super")) { 
//同级标签中可能会有多个[super='y']存在，只取一个，用return false;控制，执行一次就从循环体中跳出 
$ctrl.parent().children("[super='y']").each(function () { 
Error($(this), error); 
return false; 
}); 
} 
else { 
//同级一组标签一起报错 
$ctrl.parent().children("[type='" + $ctrl.attr("type") + "']").each(function () { 
Error($(this), error); 
}); 
} 
return false; 
} 
else { 
if ($ctrl.parent().children().attr("super")) { 
$ctrl.parent().c
上一个：Jquery下attr和removeAttr的使用方法
下一个：一些javascript一些题目的解析
更多图片编程知识: