您的位置:首页 > 产品设计 > UI/UE

easyui 扩展 前端 ValidateBox 验证 校验 属性

2014-01-08 14:35 369 查看
用easyui的时候自然会用到它的前端表单验证功能,自带的自然不能满足我们的需求,而且是英文的,下面就提供了我自己扩展的一些验证,欢迎指出问题

调用举例:

<input type="text" name="OA_SEND_DOC0000DRAFTING_DATE" id="OA_SEND_DOC0000DRAFTING_DATE" class="textboxsty easyui-validatebox" value="" style="width:140px" validtype="Date" />

//easyui 文本验证
//author:linxishengjiong@163.com
//调用方式:在HTML标签中加入属性如:validtype="LengthLimit[8]",无参数则如validtype="Time"
(function () {
$().ready($.extend($.fn.validatebox.defaults.rules, {
//密码修改时新旧一致判断
Equals: {
validator: function (value, param) {
return value == $(param[0]).val();
},
message: '密码不一致'
},
//身份证
IdCard: {
validator: function (value) {
var re = new RegExp(/\d{17}\w/);
if (value.match(re) != null && value.length == 18) {
return true;
}
return false;
},
message: '身份证输入不合法'
},
//手机号码
Phone: {
validator: function (value) {
var re = new RegExp(/\d{11}/);
if (value.match(re) != null && value.length == 11) {
return true;
}
return false;
},
message: '手机号码输入不合法'
},
//正整数
PositiveInteger: {
validator: function (value) {
var re = new RegExp(/^\d+$/);
if (value.match(re) != null) {
return true;
}
return false;
},
message: '正整数输入不合法'
},
//小数
Decimal: {
validator: function (value) {
var re = new RegExp(/^-?\d*.?\d+$/);
if (value.match(re) != null) {
return true;
}
return false;
},
message: '小数输入不合法'
},
//正小数
PositiveDecimal: {
validator: function (value) {
var re = new RegExp(/^\d*.?\d+$/);
if (value.match(re) != null) {
return true;
}
return false;
},
message: '正小数输入不合法'
},
//日期
Date: {
validator: function (value) {
var re = new RegExp(/^\d{4}-\d{2}-\d{2}|^\d{4}\/\d{2}\/\d{2}$/);
if (value.match(re) != null) {
return true;
}
return false;
},
message: '日期输入不合法'
},
//时间
Time: {
validator: function (value) {
var re = new RegExp(/^\d{1,2}:\d{1,2}:\d{1,2}|^\d{1,2}:\d{1,2}$/);
if (value.match(re) != null) {
return true;
}
return false;
},
message: '时间输入不合法'
},
//长度限制(按字数)
LengthLimit: {
validator: function (value, length) {
var len = 0;
for (var i = 0; i < value.length; i++) {
if (value[i].match(/[^\x00-\xff]/ig) != null) //全角
len += 2; //如果是全角,占用两个字节
else
len += 1; //半角占用一个字节
}
if (len <= length) {
return true;
}
return false;
},
message: '字符长度不能超过{0}位(中文字符算两位)'
},
//邮箱
Email: {
validator: function (value) {
var re = new RegExp(/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/);
if (value.match(re) != null) {
return true;
}
return false;
},
message: '邮箱地址输入不合法'
},
//URL浏览器地址
URL: {
validator: function (value) {
var re = new RegExp(/^(https?|ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/);
if (value.match(re) != null) {
return true;
}
return false;
},
message: 'URL输入不合法'
}
}));
}())这里指出其他一些需要注意的:

前端校验错误提示样式validatebox-invalid路径:\themes\default\easyui.css

this field is required 提示改为中文路径: jquery.easyui.min
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  javascript easyui