1.Validator.js
<scrīpt>
/*************************************************
Validator v1.03
code by 我佛山人
wfsr@msn.com
*************************************************/
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}(\-\d{1,4})?$/,
Mobile : /^(13\d{9})|(15\d{9})|(18\d{9})|(0\d{10,11})$/,
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]+$/,
Username : /^[a-z]\w{3,}$/i,
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|0) && (value|0) < 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") continue;
if(value == "") break; //值为空，不判断错误
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(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.descrīption);}
}
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("^((\\d{4})|(\\d{2}))([-./])(\\d{1,2})\\4(\\d{1,2})$"));
if(m == null ) return false;
day = m[6];
month = m[5]*1;
year = (m[2].length == 4) ? m[2] : GetFullYear(parseInt(m[3], 10));
break;
case "dmy" :
m = op.match(new RegExp("^(\\d{1,2})([-./])(\\d{1,2})\\2((\\d{4})|(\\d{2}))$"));
if(m == null ) return false;
day = m[1];
month = m[3]*1;
year = (m[5].length == 4) ? m[5] : GetFullYear(parseInt(m[6], 10));
break;
default :
break;
}
if(!parseInt(month)) return false;
month = month==0 ?12:month;
var date = new Date(year, month-1, day);
return (typeof(date) == "object" && year == date.getFullYear() && month == (date.getMonth()+1) && day == date.getDate());
function GetFullYear(y){return ((y<30 ? "20" : "19") + y)|0;}
}
}
</scrīpt>
使用：
语法：dataType="Require | Chinese | English | Number | Integer | Double | Email | Url | Phone | Mobile | Currency | Zip | IdCard | QQ | Date | SafeString | Repeat | Compare | Range | Limit | LimitB | Group | Custom"
类型：字符串。必选。
说明：用于设定表单项的输入数据验证类型。
选值说明：
可选值 验证功能
Require 必填项
Chinese 中文
English 英文
Number
数字
Integer
整数
Double
实数
Email
Email地址格式
Url
基于HTTP协议的网址格式
Phone
电话号码格式
Mobile
手机号码格式
Currency
货币格式
Zip
邮政编码
IdCard
身份证号码
QQ
QQ号码
Date
日期
SafeString
安全密码
Repeat
重复输入
Compare
关系比较
Range
输入范围
Limit
限制输入长度
LimitB
限制输入的字节长度
Group 验证单/多选按钮组
Custom 自定义正则表达式验证
语法：max="int"
类型：字符串。在dataType属性值为Range时必选，为Group且待验证项是多选按钮组时可选(此时默认值为1)，为为Limit/LimitB时可选(此时默认值为1.7976931348623157e+308，即Number.MAX_VALUE的值)。
说明：当daType属性值为Range时，用于判断输入是否在min与max的属性值间；当dataType属性值为Group，且待验证项是多选按钮组时，用于设定多选按钮组的选中个数，判断选中个数是否在[min, max]区间；当daType属性值为Limit时，用于验证输入的字符数是否在[min, max]区间；当daType属性值为LimitB时，用于验证输入字符的字节数是否在[min, max]区间。
语法：min="int"
类型：字符串。在dataType属性值为Range时必选，为Group且待验证项是多选按钮组时可选(此时默认值为1)，为为Limit/LimitB时可选(此时默认值为0)。
说明：当daType属性值为Range时，用于判断输入是否在min与max的属性值间；当dataType属性值为Group，且待验证项是多选按钮组时，用于设定多选按钮组的选中个数，判断选中个数是否在[min, max]区间；当daType属性值为Limit时，用于验证输入的字符数是否在[min, max]区间；当daType属性值为LimitB时，用于验证输入字符的字节数是否在[min, max]区间。
语法： msg="string"
类型：字符串。必选。
说明：在验证失败时要提示的出错信息。
语法：operator="NotEqual | GreaterThan | GreaterThanEqual | LessThan | LessThanEqual | Equal"
类型：字符串。在dataType属性值为Compare时可选(默认值为Equal)。
说明：参考to属性。
各选值所对应的关系操作符：
可选值 意义说明
NotEqual
不等于 !=
GreaterThan
大于 >
GreaterThanEqual
大于等于 >=
LessThan
小于 <
LessThanEqual
小于等于 <=
Equal 等于 =
语法：require="true | false"
类型：字符串。可选。
说明：用于设定表单项的验证方式。当值为false时表单项不是必填项，但当有填写时，仍然要执行dataType属性所设定的验证方法，值为true或任何非false字符时可省略此属性。
语法：to="sting | int"
类型：字符串。当dataType值为Repeat或Compare时必选。
说明：当dataType值为Repeat时，to的值为某表单项的name属性值，用于设定当前表单项的值是否与目标表单项的值一致；当dataType的值为Compare时，to的选值类型为实数，用于判断当前表单项的输入与to的值是否符合operator属性值所指定的关系。
语法：format="ymd | dmy"
类型：字符串。在dataType属性值为Date时可选(默认值为ymd)。
说明：用于验证输入是否为符合format属性值所指定格式的日期。
符合规则的输入示例 : 2004-11-23，2004/11/23，04.11.23，23-11-2004等
注意：当输入的年份为2位时，如果数值小于30，将使年份看作处于21世纪，否则为20世纪。
语法：regexp="object"
类型：字符串。在dataType属性值为Custom时必选。
说明：用于验证输入是否符合regexp属性所指定的正则表达式。
示例：
<script src="./Js/validator.js"></script>
<form name="middle_price" action="index.php" method="post" id="middle_price" onSubmit="return Validator.Validate(this,3)">
<table width="595" height="244" border="1" align="left" cellpadding="0" cellspacing="1" bgcolor="#C9C9C9">
<tr>
<th height="15" colspan="2" align="center" bgcolor="#837B6D" class="style1"> </th>
</tr><!--单张印刷报价-->
<tr>
<td width="153" height="23" align="right">数量（张）</td>
<td width="448">
<select name="paper_num" dataType="Require" msg="未选定数量">
<option value="" selected>请选择</option>
<option value="200">200</option>
<option value="500">500</option>
<option value="1000">1000</option>
<option value="2000">2000</option>
</select>
</td>
</tr>
<tr>
<td height="18" align="right">纸张尺寸（长X宽/厘米）</td>
<td>
长<input name="paper_width" type="text" size="4" width="25" dataType="Double" msg="纸张尺寸-长度,请用数字">
X宽<input name="paper_height" type="text" size="4" width="25" dataType="Double" msg="纸张尺寸-宽度,请用数字">
厘米
</td>
</tr>
<tr>
<td height="16" align="right">印刷颜色</td>
<td>
<input type="radio" name="print_color" value="单面（4+0）">单面（4+0）
<input type="radio" name="print_color" value="双面（4+4）" dataType="Group" msg="必须选择一个印刷颜色">双面（4+4）
</td>
</tr>
<tr>
<td height="15" colspan="2" align="center">
<input type="submit" name="Submit" value="提交报价">
</td>
</tr>
</table>
</form>
示例的一点点说明：
在form 里加 onSubmit="return Validator.Validate(this,3)" 其中可以定义三种错误模式，可选1,2,3(次处是3)，亲自试先好点！
<FORM name=testForm onsubmit="return formCheck();" method=post>
2.function formCheck(){
if(!isIdno(document.testForm.id.value)){
alert("身份证号码输入有误！要求只能输入数字，长度为16或18位。");
document.testForm.id.focus();
return false;}
if(!isChinaTel(document.testForm.tel.value)){
alert("固定电话号码输入有误！合法的格式为：区号-电话号码。");
document.testForm.tel.focus();
return false;}
if(!isChinaMob(document.testForm.mobi.value)){
alert("移动电话号码输入有误！");
document.testForm.mobi.focus();
return false;}
if(!isMail(document.testForm.mail.value)){
alert("邮箱输入有误！");
document.testForm.mail.focus();
return false;}
if(!isPostCode(document.testForm.post.value)){
alert("邮政编码输入有误！要求只能输入数字，长度为6位。");
document.testForm.post.focus();
return false;}
if(!isNLU(document.testForm.nlu.value)){
alert("该域只能输入数字、字母或下划线！");
document.testForm.nlu.focus();
return false;}
var len=getLength(document.testForm.leng.value);
if(len<4||len>6){
alert("该域要求输入长度范围是4至6个字符！");
document.testForm.leng.focus();
return false;}
}
function focusInFirst(){
document.forms[0].elements[0].focus();}
/*判断用户输入是否为空*/
function isEmpty(ui) {
return (ui==null||ui=="");}
/*取得用户输入的字符串的长度*/
function getLength(ui) {
var i,sum=0;
for(i=0;i<ui.length;i++) {
if ((ui.charCodeAt(i)>=0) && (ui.charCodeAt(i)<=255))
sum++;
else
sum+=2;}
return sum;}
/*是否为数字、字母或下划线*/
function isNLU(ui) {
var valid=/^\w*$/;
return (valid.test(ui));}
/*判断是否为身份证号码*/
function isIdno(ui){
var valid=/(^\d{16}$)|(^\d{18}$)/;
return (isEmpty(ui)||valid.test(ui));}
/*判断是否为邮政编码*/
function isPostCode(ui){
var valid=/^\d{6}$/;
return (isEmpty(ui)||valid.test(ui));}
/*判断是否为固定电话*/
function isChinaTel(ui){
var valid=/^0\d{2,3}\-\d{7,8}$/;
return (isEmpty(ui)||valid.test(ui));}
/*判断是否为移动电话*/
function isChinaMob(ui){
var valid=/^0?13[0,1,3,5,6,8,9]\d{8}$/;
return (isEmpty(ui)||valid.test(ui));}
/*判断是否为电话，只能为固定电话或移动电话*/
function isTel(ui){
var valid=/(^0\d{2,3}\-\d{7,8}$)|(^0?13[0,1,3,5,6,8,9]\d{8}$)/;
return (isEmpty(ui)||valid.test(ui));}
/*判断是否为邮件*/
function isMail(ui){
if(isEmpty(ui)){return true;}
var notValid=/(@.*@)|(\.\.)|(@\.)|(\.@)|(^\.)|(^\-)|(\-\.)|(\.\-)/;
var valid=/^.+\@[a-zA-Z0-9\-\.]+\.[a-zA-Z]{2,3}$/;
return (!notValid.test(ui)&&valid.test(ui));}
/*用户输入字符串长度是否在两值之间*/
function isLenBetween(ui,minl,maxl) {
return (ui>=minl&&ui<=maxl);}
