栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

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

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

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

后经过一段对Jquery的学习,Jquery的强大解决了辅助代码过多不易维护的问题。
AutoValidate.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"用追加提示信息,要用y以外字母得修改同级一组验证,同级一组的标签可以在第一个标签进行super="y"属性标识,其它不用
//len="***"长度限制,用于textarea标签
//
$(function () {
//正则匿名对象
var strRegex = {};
//错误信息匿名对象
var strError = {};
//正确信息匿名对象
var strRight = {};

//非空
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 = "请核对网址格式,如https://www.jb51.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}((0d)|(1[0-2]))(([0|1|2]d)|3[0-1])((d{4})|d{3}[X,x]))|([1-9]d{5}[1-9]d{1}((0d)|(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 = "";
var SpanOk = "";


//文件目录,回返最顶级目录 ../
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().children("[super='y']").each(function () {
Ok($(this));
return false;
});
}
else {
$ctrl.parent().children().each(function () {
Ok($(this));
});
}
return true;
}
}
//验证单个input(type=radio)标签 或 input(type=checkbox)标签
function RegexInputCheckBoxRadioonly($ctrl, error) {
if (!$ctrl.attr("checked")) {
Error($ctrl, error);
return false;
}
else {
Ok($ctrl);
return true;
}
}
//select标签,选项验证
function RegexSelect($ctrl) {
if ($ctrl.val() == strRegex.DDL) {
Error($ctrl, strError.DDL);
return false;
}
else {
Ok($ctrl);
return true;
}
}
//标签允许为空内容格式验证,type=text标签验证
function RegexInputTextonly($ctrl, Regex, error) {
//先验证标签是否为空
if (strRegex.NoNull.test($ctrl.val())) {
return RegexOtherFormat($ctrl, Regex, error);
}
else {
Ok($ctrl);
return true;
}
}
//标签不允许为空内容格式验证,type=text标签验证
function RegexInputTextAll($ctrl, Regex, error) {
//先验证标签是否为空
if (strRegex.NoNull.test($ctrl.val())) {
return RegexOtherFormat($ctrl, Regex, error);
}
else {
Error($ctrl, error);
return false;
}
}
//标签内容格式验证
function RegexOtherFormat($ctrl, Regex, error) {
if (Regex.test($ctrl.val())) {
return RegexLen($ctrl);
}
else {
Error($ctrl, error);
return false;
}
}
//textarea标签长度验证
function RegexLen($ctrl) {
//标签中是否有len属性
if ($ctrl.attr("len")) {
var error = strError.Length + $ctrl.attr("len") + "字!";
if (parseInt($ctrl.val().length) > parseInt($ctrl.attr("len"))) {
Error($ctrl, error);
return false;
}
}
Ok($ctrl);
return true;
}
//格式验证错误显示
function Error($ctrl, error) {
//标签中有err属性,根据属性内容填入title中
if ($ctrl.attr("err")) {
error = $ctrl.attr("err");
}
if ($ctrl.attr("super")) {
//具有super属性标签追加span
$ctrl.parent().find("span").remove();
$ctrl.parent().append(SpanError);
$ctrl.parent().find("span").append(error);
$ctrl.parent().find("span").fadeTo("slow", 0.66);
}
else {
//追加到title属性中
$ctrl.attr("title", error);
$ctrl.addClass("error");
}
}
//格式验证无误,清除错误样式
function Ok($ctrl) {
//去除可以存在的错误样式
if ($ctrl.attr("super")) {
$ctrl.parent().find("span").remove();
}
else {
$ctrl.removeClass("error");
}
if ($.trim($ctrl.val()).length > 0) {
var right = strRight.Info;
//检查标签中是否有rig属性
if ($ctrl.attr("rig")) {
right = $ctrl.attr("rig");
}
//添加正确提示信息
if ($ctrl.attr("super")) {
$ctrl.parent().append(SpanOk);
$ctrl.parent().find("span").append(right);
$ctrl.parent().find("span").fadeTo("slow",0.99).fadeTo("slow",0.99).fadeTo("slow",0);
}
else {
$ctrl.attr("title", right);
}
}
}
//提交自检
$("#vldBtn").click(function () {
$("#form1 [vld]").each(function () {
RegexGether($(this));
});
//检查标签中样式是否有error
if ($("#form1 [vld][class='error']").length > 0) {
return false;
}
else {
return true;
}
});
});

AutoValidate.htm
复制代码 代码如下:















转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/114771.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号