Easyui validatebox后台服务端验证

 Easyui validatebox的验证提示十分好用，可是在实际项目的运用中，经常会遇到需要服务器验证后并返回验证结果信息，比如验证用户名、手机号、邮箱是否已存在。于是就想着怎么拓展Easyui的验证策略，使其支持服务端验证。具体实现代码如下：

文件名称：jquery.easyui.extend.validate.js

/** 
 * 功能:拓展easyui 自定义验证框规则
 * 用法: 与easyui自带的验证框使用方法一致
 */
$.extend($.fn.validatebox.defaults.rules,{
    minLength:{// 判断最小长度
        validator:function(value,param) {
            return value.length>=param[0];
        },
    message:'请最少输入{0}个字符.'
    },
    length:{
        validator:function(value,param){
            var len=$.trim(value).length;
            return len>=param[0]&&len<=param[1];
        },
        message:"输入内容长度必须介于{0}和{1}之间."
    },
    phone:{// 验证电话号码
        validator:function(value) {
            return /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/i.test(value);
        },
        message:'格式不正确,请使用如下格式:020-88888888'
    },
    mobile:{// 验证手机号码
        validator:function(value) {
            return /^(11|12|13|14|15|16|17|18|19)\d{9}$/i.test(value);
        },
        message:'手机号码格式不正确,请使用如下格式:13118957545'
    },
    idcard:{// 验证身份证
        validator:function(value) {
           return /^\d{15}(\d{2}[A-Za-z0-9])?$/i.test(value);
        },
        message:'身份证号码格式不正确'
    },
    intOrFloat:{// 验证整数或小数
        validator:function(value) {
            return /^\d+(\.\d+)?$/i.test(value);
        },
        message:'请输入数字，并确保格式正确'
    },
    currency:{// 验证货币
        validator:function(value) {
            return /^\d+(\.\d+)?$/i.test(value);
        },
        message:'货币格式不正确'
    },
    qq:{// 验证QQ,从10000开始
        validator:function(value) {
            return /^[1-9]\d{4,9}$/i.test(value);
        },
        message:'QQ号码格式不正确'
    },
    integer:{// 验证整数
        validator:function(value) {
            return /^[+]?[1-9]+\d*$/i.test(value);
        },
        message:'请输入大于0的整数'
    },
    number:{// 验证数字
        validator:function(value) {
            return /^[+]?[0-9]+\d*$/i.test(value);
        },
        message:'请输入正整数'
    },
    chinese:{// 验证中文
        validator:function(value) {
            return /^[\u0391-\uFFE5]+$/i.test(value);
        },
        message:'请输入中文'
    },
    english:{// 验证英语
        validator:function(value) {
            return /^[A-Za-z]+$/i.test(value);
        },
        message:'请输入英文'
    },
    unnormal:{// 验证是否包含空格和非法字符
        validator:function(value) {
            return /.+/i.test(value);
        },
        message:'输入值不能为空和包含其他非法字符'
    },
    username:{// 验证用户名
        validator:function(value) {
            return /^[a-zA-Z][a-zA-Z0-9_]{5,15}$/i.test(value);
        },
        message:'用户名不合法（字母开头，允许6-16字符长度，允许字母数字下划线）'
    },
    faxno:{// 验证传真
        validator:function(value) {
            // return /^[+]{0,1}(\d){1,3}[ ]?([-]?((\d)|[ ]){1,12})+$/i.test(value);
            return /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/i.test(value);
        },
        message:'传真号码不正确'
    },
    zip:{// 验证邮政编码
        validator:function(value) {
            return /^[1-9]\d{5}$/i.test(value);
        },
        message:'邮政编码格式不正确'
    },
    ip:{// 验证IP地址
        validator:function(value) {
            return /d+.d+.d+.d+/i.test(value);
        },
        message:'IP地址格式不正确'
    },
    name:{// 验证姓名，可以是中文或英文
        validator:function(value) {
            return /^[\u0391-\uFFE5]+$/i.test(value)|/^\w+[\w\s]+\w+$/i.test(value);
        },
        message:'请输入姓名'
    },
    carNo:{ //验证车牌号码
        validator:function(value){
            return /^[\u4E00-\u9FA5][\da-zA-Z]{6}$/.test(value); 
        },
        message:'车牌号码无效（例：粤J12350）'
    },
    carenergin:{
        validator:function(value){
            return /^[a-zA-Z0-9]{16}$/.test(value); 
        },
        message:'发动机型号无效(例：FG6H012345654584)'
    },
    email:{ //验证邮箱
        validator:function(value){
            return /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(value); 
        },
        message:'请输入有效的电子邮件账号(例：abc@126.com)'
    },
    msn:{ //验证msn
        validator:function(value){
            return /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(value); 
        },
        message:'请输入有效的msn账号(例：abc@hotnail(msn/live).com)'
    },
    same:{ //确认两次密码是否一致
        validator:function(value,param){
            if($("#"+param[0]).val() !=""&&value!=""){
                return $("#"+param[0]).val() ==value; 
            }else{
                return true;
            }
        },
        message:'两次输入的密码不一致！'
    },
    // 验证编码是否重复【后端服务器验证返回】
    productBasisVerify: {
        validator: function(value, param) {
            if (value != "") {
                var result = false;
                $.ajax({
                    type: 'POST',
                    url: ProductBase.urls['verifyData'],
                    data: {verify: param, value: value},
                    dataType: 'json',
                    async: false, // 关闭异步
                    success: function(rec) {
                        if (rec.success){
                            result = true;
                        } else {
                            result = false;
                        }
                    }
                });
                return result;
            }
        },
        message: '该编码已被使用，请换个试试！'
    },
    license:{//验证营业执照
        validator:function(value){
            return/^\d{15}$/.test(value);
        },
        message:'营业执照格式输入错误'
    },
    texture:{//验证组织机构代码
        validator:function(value){
            return/^[a-zA-Z0-9]\S(([0-9]){7}\S)?[a-zA-Z0-9]+$/.test(value);
        },
        message:'组织机构代码格式输入错误'
    },
    taxation_number:{//验证税务登记证
        validator:function(value){
            return/(^\d\S{14}|^\d\S{17})$/.test(value);
        },
        message:'税务登记证格式输入错误'
    },
    bank_account:{//验证银行卡号
        validator:function(value){
            return/^[0-9]*$/.test(value);
        },
        message:'银行卡号格式输入错误'
    },
 });

Easyui本身的验证机制是设置一个计时器，然后按照计时器触发验证规则进行验证，但是对应长的文本输入框，就会导致还未完全输入就已经验证了好几次了。有人说把Easyui的计时器修改短一点不就行了嘛，但是对于编码、手机号码这些短的字段要进行校验呢？校验效果又不理想了，所以最终的解决办法如下：

<script type="text/javascript">
    $(function(){
　　　　 // 元素失去焦点进行验证
        $('#base_part_edit_form .easyui-validatebox-blur').bind('blur', function(){
            $(this).validatebox('enableValidation');
        });
　　　　 // 元素获得焦点关闭验证
        $('#base_part_edit_form .easyui-validatebox-blur').bind('focus', function(){
            $(this).validatebox('disableValidation');
        });
    })
</script>