Easy Validate简易表单验证

dh20156 2008-10-07 09:31:33

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

以下方法思路为：

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

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 isNaN($value)}},

                isNumber:function(){return function($value){return !isNaN($value)}},

                isInt:function(){return function($value){return parseInt($value)==$value}},

                isEmail:function(){return function($value){return /^\w+@\w+(?:\.\w+)+$/i.test($value)}},

                fileType:function(list){return function($value){var r = new RegExp('\.(?:'+list+')$','i');return r.test($value)}},

                moreThan:function(n){return function($value){return $value>n}},

                lessThan:function(n){return function($value){return $value<n}},

                equalTo:function(n){return function($value){return $value==n}},

                maxLength:function(n){return function($value){return !($value.length>n)}},

                minLength:function(n){return function($value){return !($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>