jsp前端验证(非常好用)

1.在jsp页面中引入<script type="text/javascript" src="${ctxStatic}/js/valid.js"></script>

2.需要验证的控件

<input type="text" name="empName" dataType="Require" msg="员工名称不能为空!"/>

加上dataType和msg属性.
dataType

验证格式,Require:不能为空,Integer:只能输入数字,其他可选值:Email,Phone,Mobile,Url,IdCard,Currency,Number,Zip,QQ,Double,English,Chinese,Username

onKeyUp="double(event,this) 只做输入校验不做form 提交前校验、只能输入整数和小数并且只能说人小数两位

onKeyUp="int(event,this) 只做输入校验不做form 提交前校验、只能输入整数

msg 不符合验证规范触发的提示信息
/*******************************************************************************
 * Validator v1.05 zhouzhiwei
 ******************************************************************************/

 function int(event, obj) {
    // 响应鼠标事件,允许左右方向键移动
    event = window.event || event;
    if (event.keyCode == 37 | event.keyCode == 39) {
        return;
    }
    // 先把非数字的都替换掉,除了数字和.
    obj.value = obj.value.replace(/[^\d.]/g, "");
    // 必须保证第一个为数字而不是.
    obj.value = obj.value.replace(/^\./g, "");
    // 保证只有出现一个.而没有多个.
    obj.value = obj.value.replace(/\.{2,}/g, ".");
    // 保证.只出现一次,而不能出现两次以上
    obj.value = obj.value.replace(".", "$#$").replace(/\./g, "").replace("$#$",    ".");

    checkNum(obj);
}
 

    function double(event,obj) {  
        // 响应鼠标事件,允许左右方向键移动
      event = window.event || event;
        if (event.keyCode == 37 | event.keyCode == 39) {
            return;
      }                                
      obj.value = obj.value.replace(/[^\d.]/g,"");  //清除“数字”和“.”以外的字符  
      obj.value = obj.value.replace(/^\./g,"");  //验证第一个字符是数字而不是.  
      obj.value = obj.value.replace(/\.{2,}/g,"."); //只保留第一个. 清除多余的  
      obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");  
      obj.value=obj.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3');//只能输入两个小数  
    }
    
    
    
    
function checkNum(obj) {
    // 为了去除最后一个.
    obj.value = obj.value.replace(/\.$/g, "");
} 


String.prototype.trim = function() 
{ 
   return this.replace(/(^\s*)|(\s*$)/g, ""); 
} 

String.prototype.lTrim = function() 
{ 
  return this.replace(/(^\s*)/g, ""); 
} 

String.prototype.rTrim = function() 
{ 
  return this.replace(/(\s*$)/g, ""); 
}

Validator = {    Require : /.+/,
    Email : /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/,
    Phone : /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/,
    Mobile : /^((\(\d{2,3}\))|(\d{3}\-))?13\d{9}$/,
    CMobile:/^1\d{10}$/,
    Url : /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/,
    IdCard : "this.IsIdCard(value)",
    Currency : /^\d+(\.\d+)?$/,
    Number : /^\d+$/,
    Zip : /^[1-9]\d{5}$/,
    QQ : /^[1-9]\d{4,8}$/,
    Integer : /^[-\+]?\d+$/,
    Double : /^[-\+]?\d+(\.\d+)?$/,
    English : /^[A-Za-z]+$/,
    Chinese : /^[\u0391-\uFFE5]+((\·||\.)?[\u0391-\uFFE5]+)+$/,
    Username : /^[a-z]\w{3,}$/i,
    UnSafe : /^(([A-Z]*|[a-z]*|\d*|[-_\~!@#\$%\^&\*\.\(\)\[\]\{\}<>\?\\\/\'\"]*)|.{0,5})$|\s/,
    RMB :  /^\d+(\.\d{2})?$/,
    IsSafe : function(str) {
        return !this.UnSafe.test(str);
    },
    SafeString : "this.IsSafe(value)",
    Filter : "this.DoFilter(value, getAttribute('accept'))",
    Limit : "this.limit(value.length,getAttribute('min'), getAttribute('max'))",
    LimitB : "this.limit(this.LenB(value), getAttribute('min'), getAttribute('max'))",
    Date : "this.IsDate(value, getAttribute('min'), getAttribute('format'))",
    Repeat : "value == document.getElementsByName(getAttribute('to'))[0].value",
    Range : "getAttribute('min') < (value|0) && (value|0) < getAttribute('max')",
    Compare : "this.compare(value,getAttribute('operator'),getAttribute('to'))",
    Custom : "this.Exec(value, getAttribute('regexp'))",
    Group : "this.MustChecked(getAttribute('name'), getAttribute('min'), getAttribute('max'))",
    ErrorItem : [ document.forms[0] ],
    ErrorMessage : [ "以下原因导致提交失败:\t\t\t\t" ],
    Validate : function(theForm, mode) {
        var obj = theForm || event.srcElement;
        var count = obj.elements.length;
        this.ErrorMessage.length = 1;
        this.ErrorItem.length = 1;
        this.ErrorItem[0] = obj;
        for ( var i = 0; i < count; i++) {
            with (obj.elements[i]) {
                var _dataType = getAttribute("dataType");
                if (typeof (_dataType) == "object"
                        || typeof (this[_dataType]) == "undefined")
                    continue;
                this.ClearState(obj.elements[i]);
                if (getAttribute("require") == "false" && value.trim() == "")
                    continue;
                value = value.trim();
                switch (_dataType) {
                case "IdCard":
                case "Date":
                case "Repeat":
                case "Range":
                case "Compare":
                case "Custom":
                case "Group":
                case "Limit":
                case "LimitB":
                case "SafeString":
                case "Filter":
                    if (!eval(this[_dataType])) {
                        this.AddError(i, getAttribute("msg"));
                    }
                    break;
                default:
                    if (!this[_dataType].test(value)) {
                        this.AddError(i, getAttribute("msg"));
                    }
                    break;
                }
            }
        }
        if (this.ErrorMessage.length > 1) {
            mode = mode || 1;
            var errCount = this.ErrorItem.length;
            switch (mode) {
            case 2:
                for ( var i = 1; i < errCount; i++)
                    this.ErrorItem[i].style.color = "red";
            case 1:
                alert(this.ErrorMessage.join("\n"));
                this.ErrorItem[1].focus();
                break;
            case 3:
                for ( var i = 1; i < errCount; i++) {
                    try {
                        var span = document.createElement("SPAN");
                        span.id = "__ErrorMessagePanel";
                        span.style.color = "red";
                        this.ErrorItem[i].parentNode.appendChild(span);
                        span.innerHTML = this.ErrorMessage[i].replace(/\d+:/,
                                "*");
                    } catch (e) {
                        alert(e.description);
                    }
                }
                this.ErrorItem[1].focus();
                break;
            default:
                alert(this.ErrorMessage.join("\n"));
                break;
            }
            return false;
        }
        return true;
    },
    limit : function(len, min, max) {
        min = min || 0;
        max = max || Number.MAX_VALUE;
        return min <= len && len <= max;
    },
    LenB : function(str) {
        return str.replace(/[^\x00-\xff]/g, "**").length;
    },
    ClearState : function(elem) {
        with (elem) {
            if (style.color == "red")
                style.color = "";
            var lastNode = parentNode.childNodes[parentNode.childNodes.length - 1];
            if (lastNode.id == "__ErrorMessagePanel")
                parentNode.removeChild(lastNode);
        }
    },
    AddError : function(index, str) {
        this.ErrorItem[this.ErrorItem.length] = this.ErrorItem[0].elements[index];
        this.ErrorMessage[this.ErrorMessage.length] = this.ErrorMessage.length
                + ":" + str;
    },
    Exec : function(op, reg) {
        return new RegExp(reg, "g").test(op);
    },
    compare : function(op1, operator, op2) {
        switch (operator) {
        case "NotEqual":
            return (op1 != op2);
        case "GreaterThan":
            return (op1 > op2);
        case "GreaterThanEqual":
            return (op1 >= op2);
        case "LessThan":
            return (op1 < op2);
        case "LessThanEqual":
            return (op1 <= op2);
        default:
            return (op1 == op2);
        }
    },
    MustChecked : function(name, min, max) {
        var groups = document.getElementsByName(name);
        var hasChecked = 0;
        min = min || 1;
        max = max || groups.length;
        for ( var i = groups.length - 1; i >= 0; i--)
            if (groups[i].checked)
                hasChecked++;
        return min <= hasChecked && hasChecked <= max;
    },
    DoFilter : function(input, filter) {
        return new RegExp("^.+\.(?=EXT)(EXT)$".replace(/EXT/g, filter.split(
                /\s*,\s*/).join("|")), "gi").test(input);
    },
    IsIdCard : function(number) {
        number = number.toUpperCase();
        var date, Ai;
        var verify = "10X98765432";
        var Wi = [ 7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2 ];
        var area = [ '', '', '', '', '', '', '', '', '', '', '', '北京', '天津',
                '河北', '山西', '内蒙古', '', '', '', '', '', '辽宁', '吉林', '黑龙江', '',
                '', '', '', '', '', '', '上海', '江苏', '浙江', '安微', '福建', '江西',
                '山东', '', '', '', '河南', '湖北', '湖南', '广东', '广西', '海南', '', '',
                '', '重庆', '四川', '贵州', '云南', '西藏', '', '', '', '', '', '', '陕西',
                '甘肃', '青海', '宁夏', '新疆', '', '', '', '', '', '台湾', '', '', '',
                '', '', '', '', '', '', '香港', '澳门', '', '', '', '', '', '', '',
                '', '国外' ];
        var re = number
                .match(/^(\d{2})\d{4}(((\d{2})(\d{2})(\d{2})(\d{3}))|((\d{4})(\d{2})(\d{2})(\d{3}[X\d])))$/i);
        if (re == null)
            return false;
        if (re[1] >= area.length || area[re[1]] == "")
            return false;
        if (re[2].length == 12) {
            Ai = number.substr(0, 17);
            date = [ re[9], re[10], re[11] ].join("-");
        } else {
            var con = number.match(/^\d*[123456789]{5,6}\d*$/);
            if (con != null)
                return false;
            Ai = number.substr(0, 6) + "19" + number.substr(6);
            date = [ "19" + re[4], re[5], re[6] ].join("-");
        }
        if (!this.IsDate(date, "ymd"))
            return false;
        var sum = 0;
        for ( var i = 0; i <= 16; i++) {
            sum += Ai.charAt(i) * Wi[i];
        }
        Ai += verify.charAt(sum % 11);
        return (number.length == 15 || number.length == 18 && number == Ai);
    },
    IsDate : function(op, formatString) {
        formatString = formatString || "ymd";
        var m, year, month, day;
        switch (formatString) {
        case "ymd":
            m = op.match(new RegExp(
                    "^((\\d{4})|(\\d{2}))([-./])(\\d{1,2})\\4(\\d{1,2})$"));
            if (m == null)
                return false;
            day = m[6];
            month = m[5] * 1;
            year = (m[2].length == 4) ? m[2] : GetFullYear(parseInt(m[3], 10));
            break;
        case "dmy":
            m = op.match(new RegExp(
                    "^(\\d{1,2})([-./])(\\d{1,2})\\2((\\d{4})|(\\d{2}))$"));
            if (m == null)
                return false;
            day = m[1];
            month = m[3] * 1;
            year = (m[5].length == 4) ? m[5] : GetFullYear(parseInt(m[6], 10));
            break;
        default:
            break;
        }
        if (!parseInt(month))
            return false;
        month = month == 0 ? 12 : month;
        var date = new Date(year, month - 1, day);
        return (typeof (date) == "object" && year == date.getFullYear()
                && month == (date.getMonth() + 1) && day == date.getDate());
        function GetFullYear(y) {
            return ((y < 30 ? "20" : "19") + y) | 0;
        }
    }
}

 

posted @ 2015-06-12 10:02  也许还年轻  阅读(1752)  评论(0编辑  收藏  举报