一个比较完善表单校验插件

(function($){
    $.fn.jStar.defaults = {
        validationAttr:      'vtype',       //需要校验的标识属性
        warnAttr:            'warnText',   //校验错误时提示的文本属性
        errorMsgs:           ''
    };
    $.fn.isValid=function(){
        var vFlds = findValidateFields($(this)),
            foucusFlag=0;
            options.errorMsgs='';
        var showErrorMsgsLengthFlag= 0,
            flag=0;//控制显示输入错误的提示信息条数
        $(vFlds).each(function(){
            var fldValidations=buildSingleFldVType(this);
            var errorMsg=buildErrorMsg(fldValidations,this);
            if(errorMsg&&3==showErrorMsgsLengthFlag&&0==flag){ //这个判断需要放在showErrorMsgsLengthFlag自增前面
                options.errorMsgs+='
  • ··· ···
  • ';
                    flag++;
                }
                if(errorMsg&&showErrorMsgsLengthFlag<3){
                    options.errorMsgs+=errorMsg;
                    showErrorMsgsLengthFlag++;
                }
            });
            //????光标定位????i still dont know how......
            var firstErrorMsg=options.errorMsgs.substring(0,options.errorMsgs.indexOf('<br/>'));
            if(firstErrorMsg){
                var obj = $('[warnText]',this);
                for(var i=0;i<obj.length;i++){
                    var errorMsg=$(obj[i]).attr('warnText');
                    if(firstErrorMsg==errorMsg){
    //                    showErrorMsgs();
                        obj[i].focus();
                        return false;
                    }
                }
            }

            if(options.errorMsgs.length>0)return false;
            else return true;
        };


        function buildErrorMsg(fldValidations, field) {
            var errorMsg = '';
            for(var i = 0; i < fldValidations.length; i++){
                var funcName = getVFunctionName(fldValidations[i]);
                var params = buildVParams(fldValidations[i]);
                if(!eval('$.fn.jStar.validations["'+funcName+'"](field, field.val()'+params+')')) {
                    errorMsg+='
  • '+$(field).attr(options.warnAttr)+'
  • ';
                }
            }
            return errorMsg;
        }
        //拿到需要校验元素的校验类型的参数。eg: range(1,100)
        function buildVParams(validation) {
            if(validation.indexOf('(') != -1) {
                var arr = validation.substring(validation.indexOf('(') + 1, validation.length - 1).split(',');
                var tempStr = '';


                for(var i = 0; i < arr.length; i++) {
                    var single = trim(arr[i]);
                    if(parseInt(single)) {
                        tempStr += ','+single;
                    } else {
                        tempStr += ',"'+single+'"'
                    }
                }


                return tempStr;
            } else {
                return '';
            }
        }


        //找到所有需要校验的元素
        function findValidateFields(form) {
            var tags = 'input textarea select'.split(' ');
            var fields = [];


            for(var i = 0; i < tags.length; i++) {
                form.find(tags[i]+'['+options.validationAttr+']').each(function() {
                    if($(this).attr(options.validationAttr)){//判断options.validationAttr是否为空
                        fields.push($(this));
                    }
                });
            }
            return fields;
        }
        //各元素需要校验的类型
        function buildSingleFldVType(field) {
            var valStr = field.attr(options.validationAttr);
            var fldValidations=[];
            var tempStr = '';
            var openBrackets = 0;
            for(var i = 0; i < valStr.length; i++) {
                switch(valStr[i]) {
                    case ',':
                        if(openBrackets) {
                            tempStr += ',';
                            openBrackets--;
                        } else {
                            fldValidations.push(trim(tempStr));
                            tempStr = '';
                        }
                        break;
                    case '(':
                        tempStr += '(';
                        openBrackets++;
                        break;
                    case ')':
                        tempStr += ')';
                        fldValidations.push(trim(tempStr));
                        tempStr='';
                        break;
                    default:
                        tempStr += valStr[i];
                }
                if(valStr.length-1==i&&')'!=valStr[i]){//判断最后一个字符是不是')',是则不执行下面一行代码
                    fldValidations.push(tempStr);
                }
            }
            return fldValidations;
        }


        function getVFunctionName(validation) {
            if(validation.indexOf('(') != -1) {
                return validation.substr(0, validation.indexOf('('));
            } else {
                return validation;
            }
        }
        //去掉前后导空格
        function trim(str) {
            return str.replace(/^\s+/, '').replace(/\s+$/, '');
        }
        var options={};
        options=$.fn.jStar.defaults;


    })(jQuery);

    你可能感兴趣的:(js,jquery,validation,formValidation)