Easy Validate简易表单验证

在做项目的时候有许多表单需要验证,而这些验证只是一些简易的验证,类似必填,格式之类,为此,有必要整理一个简易通用且容易扩展的表单验证方法。

以下方法思路为:

为需要验证的输入项添加两个自定义属性作为判断的依据以及需要执行的验证

    validate="这里输入验证方法,多种验证以分号隔开"

    msg="这里输入验证不合格时提示的信息,与validate一一对应,如果信息数少于验证方法数量,则后面的验证不合格时将显示最后一条提示信息"

验证方法可自行扩展,形如:

var rules = {
                isFilled:function(validate里提供的参数,可有可无){return function(由后面程序中传递进来的参数$value){return $value.replace(//s/g,"").length>0&&$value!=validate里提供的参数}}
}

使用如下:

<input type="text" validate="isFilled" msg="本项目必须填写!">

代码如下:

<script type="text/javascript">
var nameSpace = {
    checkForm:function(dForm){
        if(!dForm) return false;
            var rules = {
            isFilled:function(s){return function($value){return $value.replace(//s/g,"").length>0&&$value!=s}},
            isNaN:function(){return function($value){return (!$value)?true:isNaN($value)}},
            isNumber:function(){return function($value){return (!$value)?true:!isNaN($value)}},
            isInt:function(){return function($value){return (!$value)?true:parseInt($value)==$value}},
            isEmail:function(){return function($value){return (!$value)?true:/^(?:/w/.?)*/w+@(?:/w/.?)+/w+$/i.test($value)}},
            isEmailList:function(){return function($value){return (!$value)?true:/^(?!;)(?:(?:;|^)([^@.;])+@[^.@;]+(?:/.[^.@;]+)+)+$/i.test($value)}},
            fileType:function(list){return function($value){var r = new RegExp('/.(?:'+list+')$','i');return (!$value)?true:r.test($value)}},
            moreThan:function(n){return function($value){return (!$value)?true:$value>n}},
            lessThan:function(n){return function($value){return (!$value)?true:$value<n}},
            equalTo:function(n){return function($value){return (!$value)?true:$value==n}},
            maxLength:function(n){return function($value){return (!$value)?true:!($value.length>n)}},
            minLength:function(n){return function($value){return (!$value)?true:!($value.length<n)}}
        }
            var chkInput = function(dObj){
                for(var i=0,l=dObj.length;i<l;i++){
                    var dT = dObj[i];
                    var vr = dT.getAttribute('validate');//validate property
                    var vm = dT.getAttribute('msg');//msg property
                    var $value = dT.value;//value
                    if(vr){
                        vr = vr.split(';'),vm = vm.split(';');
                        for(var n=0;n<vr.length;n++){
                            var avr = vr[n].match(/^(/w+)/(([^/)]*)/)$/i);//match the validate string look like 'fooName(xxx)'
                            var avrName = avr?avr[1]:vr[n];//fooName
                            var avrArgs = avr?avr[2]:null;//xxx
                            var msg = vm[n]?vm[n]:vm[vm.length-1];//alert message
                            var EVR = (rules[avrName])?rules[avrName](avrArgs)($value):false;
                            if(!EVR){
                                alert(msg);
                                dT.focus();
                                return false;
                            }
                        }
                    }
                }
            return true;
        }
        return chkInput(dForm.elements);
    }
}
</script>

在线演示,请参见 http://www.v-ec.com/jslib
【easy Validate】 部分!
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值