日期:2014-05-16  浏览次数:20385 次

关于JS校验validate的一点儿心得

?

应公司要求花了几天时间写了一个校验validate框架,想整理一下心得,但不方便把代码放上来,这里共享一下设计思路。

?

?

类图:

?

序列图:





简单的说一下,

?

ErrorMessage可是自己设计需要的错误提示信息的样式,在Validete类中通过getMessager()方法来获取ErrorMessage实例;

?

ValideteRule类中有很多校验规则的细项,比如不能为空,字符长度,邮件格式等等,每个校验规则都是一个独立的类,类似代码如下:

?

?

?

/**

?* @description 验证最大长度

?* @constructor CheckMaxLength

?* @param option JSON对象?

?* @example new CheckMaxLength({msg:'最大长度不可超过16位',length:'16'});?

?*/

function CheckMaxLength(option){

? /**?

?? ? * @description {String} 错误提示信息?

?? ? * @field?

?? ? */ ?

this.msg = option.msg;

/**?

?? ? * @description {Num} 长度?

?? ? * @field?

?? ? */ ?

this.length = option.length;

}

/**

?* @description 执行校验

?* @param obj ?校验对象

?* @throws msg 错误提示信息

?*/

CheckMaxLength.prototype.validate = function(obj){

if (obj.value.length<1) ?return true;

if(obj.value.length>this.length){

?throw ?this.msg; ? ??

}

}

?

?

?

Validete类本身类似于一个action,validete()是核心的执行校验方法,根据不同的校验规则调用规则本身的validate()方法,若校验不通过则捕获异常,抛出错误信息到ErrorMessage类修理;

?

?

结合类图与序列图,设计应该可以理解,有兴趣的朋友可以M我!




?