JavaScript简单通用表单验证源码

/**
 * Author：     Lv Yuanfang, 2006
 * Emial:       menlong999@gmail.com
 * File：       adrop.js
 * Description: JavaScript utils
 */

var adrop = {};

/*--------------------------------------------------------------------------*/

adrop.fill = function(elem,value){
    if(elem == null)return;
    var tagName = elem.tagName.toLowerCase();
    if(tagName == 'input'){
    switch(elem.type.toLowerCase()){
        case 'text':
        case 'password':
        case 'hidden':
            elem.value = value;
        case 'radio':
        case 'checkbox':
            if(elem.value == value) elem.checked = true;
        }
    }else if(tagName == 'select'){
        for(var i = 0; i < elem.options.length; i++){
            if(elem.options[i].value == value) elem.options[i].selected = true;
        }
    }else if(tagName == 'textarea'){
        elem.value = value;
    }
}

/**
 * 根据eval(jsString)的执行真假结果，来切换 elem 元素的显示与隐藏状态
 *
 * @param {Element} elem     被显示或隐藏的元素
 * @param {String}  jsString 要执行的语句
 *
 * @return {void}
 *
 */
adrop.toggleIf = function(elem,jsString){
    if(eval(jsString)) Element.show(elem);
    else Element.hide(elem);
}

/*--------------------------------------------------------------------------*/

/*
var Validation = Class.create();
Validation.prototype = {
    initalize: function(fieldObj,expr,errInfo){
        this.fieldObj = fieldObj;
        this.expr = expr;
        this.errInfo = errInfo;
        this.conds = [];
    }
}
*/
adrop.Validation = function(fieldObj,expr,errInfo){
        this.fieldObj = fieldObj;
        this.expr = expr;
        this.errInfo = errInfo;
        this.conds = [];
   
}

/*--------------------------------------------------------------------------*/

//var Validator = Class.create();
adrop.Validator = function(formName){
        this.formName = formName;
        //this.formobj=document.forms[frmname];
        this.formObj = document.forms[formName];
        if(!this.formObj) {
            // formName对应的form对象不存在 ,??
            return;
        }
        if(!this.formObj.onsubmit){
            return;
        }
        this.validations = [];
        /*
        this.formObj.onsubmit = function(){
            return this.validateAll();
        }*/
}

adrop.Validator.prototype = {
   
    initialize: function(formName){
        this.formName = formName;
        //this.formobj=document.forms[frmname];
        this.formObj = document.forms[formName];
        if(!this.formObj) {
            // formName对应的form对象不存在 ,??
            return;
        }
        if(!this.formObj.onsubmit){
            return;
        }
        this.validations = [];
        /*
        this.formObj.onsubmit = function(){
            return this.validateAll();
        }*/
    },
   
    /**
     * @param0 {String} field名称
     * @param1 {String} 校验字符串
     * @param2 {String} 错误信息
     * @[param3,...] {String|Function} 校验条件
     * @return {void}
     */
    addValidation: function(){
        if(arguments.length < 3) return;
        var fieldObj = this.formObj[arguments[0]];
        if(!fieldObj) return;
        var val = new adrop.Validation(fieldObj,arguments[1],arguments[2]);
        for(var i = 3; i < arguments.length; i++){
            val.conds.push(arguments[i]);
        }
        this.validations.push(val);
        //alert('field=' + arguments[0] + ',' + val.expr + ',' + val.errInfo);
    },
   
    /**
     * 校验所有由addValidation方法加入的表单元素
     */
    validateAll: function(){
        for(var i = 0; i < this.validations.length; i++){
            var ret = this.validate(this.validations[i]);
            if(!ret) return ret;
        }
        return true;
    },
   
    /**
     * 计算条件
     * @param conds {Array} 字符串的数组
     * @return boolean      所有条件都满足是返回true，有任何一个不满足就返回false
     */
    calcCondtions: function(conds){
        if(!conds) return true;
        if(conds.length == 0) return true;
        return conds.all(function(value,index){
            if(typeof value == 'string') return eval(value);
            if(typeof value == 'function') return value();
        });
    },
   
    /**
     * 校验单个validation类
     * @param val {Validation}
     */
    validate: function(val){
        if(!val)return true;
        if(this.calcCondtions(val.conds)){
            // 以分号;分割expr校验字符串
            var exprArray = val.expr.split(';');
            if(!exprArray)return true;
           
            // 对校验字符串的每一部分做校验
            var ret = true;
            for(var i = 0; i < exprArray.length; i++){
                //alert(exprArray[i]);
                ret = this._validate(exprArray[i],val.fieldObj);
                if(!ret)break;
            }
            // 校验不通过
            if(!ret){
                alert(val.errInfo);
                // 激活验证不通过的表单对象时，可以改变表单的样式
                this.active(val.fieldObj);
            }
            return ret;
        }
        return false;
    },
   
    /**
     * 对校验字符串的一部分做校验
     * @param expr {String} 做校验的字符串，key=value的形式，或者key
     * @return     {bool}
     */
    _validate: function(expr,fieldObj){
       
        //alert('expr=' + expr);
        //alert(fieldObj);
       
        if(!expr)return ture;// 如果校验字符串为null，直接返回true
        if(!fieldObj)return true;
        //alert('value=' + fieldObj.value);
        //if(!fieldObj.value)return true;
       
        var value = fieldObj.value;
        //alert('value=' + value);
       
        // 所有用于校验的正则表达式
        var RE_NOT_NULL = /.+/;          // 非空
        var RE_ALPHA = /^[a-zA-Z]+$/;    // 字母
        var RE_ALPHA_NUMERIC = /^[a-zA-Z0-9]+$/;    // 字母数字
        var RE_WORD = /^/w+$/;           // 字母数字和下划线_
        var RE_NUMERIC = /^/d+$/;        // 每个字符都是数字，开头可以是0
        var RE_INTEGER = /^([0-9])|([1-9]/d+)$/;   // 可以转换成十进制整数的，开头不能为0的数字字符串
        var RE_IP_ADDR = /^((25[0-5]|2[0-4][0-9]|1[0-9][0-9]|[1-9][0-9]|[0-9])/.){3}(25[0-5]|2[0-4][0-9]|1[0-9][0-9]|[1-9][0-9]|[0-9])$/
        var RE_EMAIL = /^.+/@(/[?)[a-zA-Z0-9/-/.]+/.([a-zA-Z]{2,3}|[0-9]{1,3})(/]?)$/;
       
        var parts = expr.split('=');
        if(!parts && parts.length > 2) return true;
        var key = parts[0];
        var v = parts[1];
        switch(key){
            case 'req':
            case 'required':
                if(RE_NOT_NULL.test(value))return true;
                else return false;
            case 'alpha':
                if(RE_ALPHA.test(value))return true;
                else return false;
            case 'num':
            case 'numeric':
                if(RE_NUMERIC.test(value))return true;
                else return false;
            case 'alnum':
            case 'alphanumeric':
                if(RE_ALPHA_NUMERIC.test(value))return true;
                else return false;
            case 'word':
                if(RE_WORD.test(value))return true;
                else return false;
            case 'int':
            case 'integer':
                if(RE_INTEGER.test(value))return true;
                else return false;
            case 'ip':
            case 'ipaddr':
                if(RE_IP_ADDR.test(value))return true;
                else return false;
            case 'mail':
                if(RE_EMAIL.test(value))return true;
                else return false;
            case 'len':
            case 'length':{
                if(!v)return true;
                var len = parseInt(v);if(isNaN(len))return true;
                if(len == value.length)return true;
                else return false;
            }
            case 'lt':
            case 'lessthan':{
                if(!v)return true;
                if(!RE_INTEGER.test(value))return false;
                var val1 = parseInt(v);if(isNaN(val1))return true;
                var val2 = parseInt(value);if(isNaN(val2))return true;
                if(val2 <= val1)return true;
                else return false;
            }
            case 'gt':
            case 'greaterthan':{
                if(!v)return true;
                if(!RE_INTEGER.test(value))return false;
                var val1 = parseInt(v);if(isNaN(val1))return true;
                var val2 = parseInt(value);if(isNaN(val2))return true;
                if(val2 >= val1)return true;
                else return false;
            }
            case 'maxlen':{
                if(!v)return true;
                var len = parseInt(v);if(isNaN(len))return true;
                if(len >= value.length)return true;
                else return false;
            }
            case 'minlen':{
                if(!v)return true;
                var len = parseInt(v);if(isNaN(len))return true;
                if(len <= value.length)return true;
                else return false;
            }
           
            default: return true;
               
        }
        return false;
    },
   
    active: function(fieldObj){
        if(fieldObj){
            for(prop in fieldObj.style){
                //alert(prop);
            }
            fieldObj.style['borderColor'] = 'red';
            Field.activate(fieldObj);
            //fieldObj.focus();
            //fieldObj.select();
           
        }
    }
   
}

/*--------------------------------------------------------------------------*/