Javascript验证Validator.js使⽤全解⽂件Validator.js
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+$/,
Do le : /^[-\+]?\d+(\.\d+)?$/,
English : /^[A-Za-z]+$/,
Chinese : /^[\Α-\￥]+$/,
UnSafe : /^(([A-Z]*|[a-z]*|\d*|[-_\~!@#\$%\^&\*\.\(\)\[\]\{\}<>\?\\\/\’\"]*)|.{0,5})$|\s/,
IsSafe : function(str){return !st(str);},
SafeString : "this.IsSafe(val)",
Limit : "this.limit(val.length,getAttribute(’min’), getAttribute(’max’))",
LimitB : "this.limit(this.LenB(val), getAttribute(’min’), getAttribute(’max’))",
Date : "this.IsDate(val, getAttribute(’min’), getAttribute(’format’))",
Repeat : "val== ElementsByName(getAttribute(’to’))[0].val",
Range : "getAttribute(’min’) < val&& val< getAttribute(’max’)",
Compare : "thispare(val,getAttribute(’operator’),getAttribute(’to’))",
Custom : "this.Exec(val, getAttribute(’regexp’))",
Group : "this.MustChecked(getAttribute(’name’), getAttribute(’min’), getAttribute(’max’))",
ErrorItem : [document.forms[0]],
ErrorMessage : ["The cause of failure as below : \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" contin;
this.ClearState(obj.elements[i]);
if(getAttribute("require" == "false" && val== "" contin;
switch(_dataType){
case "Date" :
case "Repeat" :
case "Range" :
case "Compare" :
case "Custom" :
case "Group" :
case "Limit" :
case "LimitB" :
case "SafeString" :
if(!eval(this[_dataType])) {
this.AddError(i, getAttribute("msg");
}
break;
default :
if(!this[_dataType].test(val)){
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].lor = "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 = ateElement("SPAN";
span.id = "__ErrorMessagePanel";
lor = "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 tr;
},
limit : function(len,min, max){
min = min || 0;
max = max || Number.MAX_VAL;
return min <= len && len <= max;
},
LenB : function(str){
place(/[^\x00-\xff]/g,"**".length;
},
ClearState : function(elem){
with(elem){
lor == "red"
var lastNode = parentNode.childNodes[parentNode.childNodes.length-1];
if(lastNode.id == "__ErrorMessagePanel"
}
},
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 "NotEq l":
return (op1 != op2);
case "GreaterThan":
return (op1 > op2);
case "GreaterThanEq l":
return (op1 >= op2);
case "LessThan":
return (op1 < op2);
case "LessThanEq l":
return (op1 <= op2);
default:
return (op1 == op2);
}
},
MustChecked : function(name, min, max){
var groups = ElementsByName(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("^\\s*((");
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("^\\s*(");
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;
}
var date = new Date(year, month, day);
return (typeof(date) == "object" && year == FullYear() && month == Month() && day == Date());
function GetFullYear(y){return ((y<30 ? "20" : "19" + y)|0;}
}
}
js 代码
使⽤：
语法：dataType="Require | Chinese | English | Number | Integer | Do
le | Email | Url | Phone | Mobile | Currency |Zip | IdCard | QQ | Date | SafeString | Repeat | Compare | Range | Limit | LimitB | Group | Custom"类型：。必选。
说明：⽤于设定表单项的输⼊数据验证类型。
选值说明：
可选值验证功能
Require必填项
Chinese中⽂
English英⽂
Number 数字
Integer 整数
Do le 实数
Email Email地址格式
Url 基于HTTP协议的⽹址格式
Phone 电话号码格式
Mobile ⼿机号码格式
Currency 货币格式
Zip
IdCard⾝份证号码
QQ QQ号码
Date ⽇期
SafeString 安全密码
Repeat 重复输⼊
Compare关系⽐较
Range输⼊范围
Limit限制输⼊长度
LimitB限制输⼊的字节长度
Group验证单/多选按钮组
Custom⾃定义验证
语法：max="int"
类型：字符串。在属性值为Range时必选，为Group且待验证项是多选按钮组时可选(此时默认值为1)，为为Limit/LimitB时可选(此时默认值为1.7976931348623157e+308，即Number.MAX_VAL的值)。
说明：当属性值为Range时，⽤于判断输⼊是否在与的属性值间；当属性值为Group，且待验证项是多选按钮组时，⽤于设定多选按钮组的选中个数，判断选中个数是否在[, ]区间；当属性值为Limit时，⽤于验证输⼊的字符数是否在[, ]区间；当属性值为LimitB时，⽤于验证输⼊字符的字节数是否在[, ]区间。
语法：min="int"
类型：字符串。在属性值为Range时必选，为Group且待验证项是多选按钮组时可选(此时默认值为1)，为为Limit/LimitB时可选(此时默认值为0)。
说明：当属性值为Range时，⽤于判断输⼊是否在与的属性值间；当属性值为Group，且待验证项是
多选按钮组时，⽤于设定多选按钮组的选中个数，判断选中个数是否在[, ]区间；当属性值为Limit时，⽤于验证输⼊的字符数是否在[, ]区间；当属性值为LimitB时，⽤于验证输⼊字符的字节数是否在[, ]区间。
语法： msg="string"
类型：字符串。必选。
说明：在验证失败时要提⽰的出错信息。
语法：operator="NotEq l | GreaterThan | GreaterThanEq l | LessThan | LessThanEq l | Eq l"
类型：字符串。在属性值为Compare时可选(默认值为Eq l)。
说明：参考属性。
各选值所对应的关系操作符：
可选值意义说明
NotEq l不等于 !=
GreaterThan ⼤于 >
GreaterThanEq
l⼤于等于 >=
LessThan ⼩于 <
LessThanEq l ⼩于等于 <=
Eq l等于 =
语法：require="tr| false"
类型：字符串。可选。
说明：⽤于设定表单项的验证⽅式。当值为false时表单项不是必填项，但当有填写时，仍然要执⾏属性所设定的验证⽅法，值为tr或任何
⾮false字符时可省略此属性。
语法：to="sting | int"
类型：字符串。当值为Repeat或Compare时必选。
说明：当值为Repeat时，to的值为某表单项的name属性值，⽤于设定当前表单项的值是否与⽬标表单项的值⼀致；当的值为Compare
时，to的选值类型为实数，⽤于判断当前表单项的输⼊与to的值是否符合属性值所指定的关系。
语法：format="ymd | dmy"
类型：字符串。在属性值为Date时可选(默认值为ymd)。
说明：⽤于验证输⼊是否为符合format属性值所指定格式的⽇期。
符合规则的输⼊⽰例 : 2004-11-23，2004/11/23，04.11.23，23-11-2004等
注意：当输⼊的年份为2位时，如果数值⼩于30，将使年份看作处于21世纪，否则为20世纪。
语法：regexp="object"
类型：字符串。在属性值为Custom时必选。
说明：⽤于验证输⼊是否符合regexp属性所指定的正则表达式。
⽰例：
********************************************************************************************
使⽤帮助（FAQs）
********************************************************************************************
-------------------------------------------------------------------------------------------
验证表单
在表单中加上ons mit事件，触发调⽤Validaotor的Validate⽅法，代码⽰例：
<form onS mit="return Validator.Validate(this,3)" action="your_application_page" method="post">
... ...
</form>
Validate⽅法有两个可选参数，第⼀个为表单对象，如果是写在表单的ons mit事件中，可以⽤this指代
当前表单，默认值为事件源对象；第⼆个参数为错误提⽰模式，可选值为1,2和3，默认值为1。省略第⼆个参数时相当于使⽤Validate(objform,1)，省略第⼀个参数时相当于Validate(this,1)。注意，不可以省略第⼀个参数⽽只写第⼆个参数，Validate(,2)是错误的⽤法。
--------------------------------------------------------------------------------------------
验证输⼊是否Email地址
代码⽰例：
<input name="Email" dataType="Email" msg="信箱格式不正确">
或
<input name="Email" dataType="Custom" regexp="^\w+([-+.]\w+)*@\w+([-.]\\w+)*\.\w+([-.]\w+)*$" msg="信箱格式不正确">
Validator的必要属性是dataType和msg(区分⼤⼩写)，然后根据dataType值的不同，会引发出不同的属性。因为程序中已经集成 Email地址格式的正则，所以可以直接⽤dateType="Email"进⾏验证，如果对Email地址的格式有不同的限制，可以⽤⾃定义的正则来验证(参考第⼆段代码)。
--------------------------------------------------------------------------------------------
验证下拉菜单是否选中
代码⽰例：
<select name="Operation" dataType="Require" msg="未选择所⽤操作系统" >
<option val="">选择您所⽤的操作系统</option>
<option val="Win98">Win98</option>
<option val="Win2k">Win2k</option>
<option val="WinXP">WinXP</option>
</select>
注意，对于IE，在option中没写val属性时IE的解释引擎将⾃动设置其值为空，⽽Firefox时将⾃动设置其值为text属性址。例如，在⽰例代码中如果第⼀个option不写val属性，IE中将得到val为空，⽽Firefox为"选择您所⽤的操作系统"。
--------------------------------------------------------------------------------------------
验证是否选中单选按钮组中的⼀个
代码⽰例：
⼴东<input name="Province" val="1" type="radio">
陕西<input name="Province" val="2" type="radio">
浙江<input name="Province" val="3" type="radio">
江西<input name="Province" val="4" type="radio" dataType="Group" msg="必须选定⼀个省份" >
对于单/多选按钮组的验证，dataType属性都为Group，然后只需在按钮组的最后⼀个写上dataType和msg属性。
注意，要成为单/多选按钮组，它们必须具有相同的name属性值。
--------------------------------------------------------------------------------------------
限制多选按钮组的选中个数
代码⽰例：
运动<input name="Favorite" val="1" type="checkbox">js中文正则表达式
上⽹<input name="Favorite" val="2" type="checkbox">
听⾳乐<input name="Favorite" val="3" type="checkbox">
看书<input name="Favorite" val="4" type="checkbox"" dataType="Group" min="2" max="3" msg="必须选择2~3种爱好">
要限制多选按钮组的选中个数，必须设置min和max属性。min属性⽤于设定选中个数的下限，max为上限，默认时min为1，max为多选按钮组的个数。
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论