前几天使用jquery.validate.js做一个注册的验证，里面有ajax验证的东西，有一点小心得，跟大家分享一下

，jquery.validate.js还是蛮好用的，其中也有对ajax验证的功能。

像注册的时候验证用户名是否重复和验证码时是用得上的，但是发现它对验证码的验证是不完美的。

validate对remote的验证原理是，有一个pengdding值来记录你的ajax验证，如果有pengdding值，它会认为有ajax验证，所以不会提交。

对于remote验证不完美的地方，就在于它的验证触发方式

同时对于ajax验证，它的处理方式是，第一次采用blur事件验证，也就是说，第一次进入输入框以后，是以blur事件触发的，后面的验证则是以每一次键入就验证一次的方式来做的，在这里为了防止一些不必要的请求，validate有一个逻辑，它认为你第一次输入正确以后，如果你不改变你的输入值，那么它认为你的输入是正确的，但是对于验证码的验证来说，输入是可以不变的，但是可以改变验证码的值，这样就会出现一个逻辑性的错误，在你对验证码输入正确的之后，然后你点击验证码改变验证码的值，但是你不改变你的输入值，那么你提交时，validate会认为依旧是正确的，这样就有错误了。造成这种逻辑错误的原因是源码中的这些代码：

?remote: function(value, element, param) {
???if ( this.optional(element) )
????return "dependency-mismatch";
???
???var previous = this.previousValue(element);
???
???if (!this.settings.messages[element.name] )
????this.settings.messages[element.name] = {};
???this.settings.messages[element.name].remote = typeof previous.message == "function" ? previous.message(value) : previous.message;
???
???param = typeof param == "string" && {url:param} || param;
???
???if ( previous.old !== value ) {//就是这句了，如果你不修改，remote方式将不再进行验证，而这个值则是存到元

//素data上的一个属性的值,所以如果对这个值在提交之前做一个处理的话，就会继续验证了
????previous.old = value;
????var validator = this;
????this.startRequest(element);
????var data = {};
????data[element.name] = value;
????$.ajax($.extend(true, {
?????url: param,
?????mode: "abort",
?????port: "validate" + element.name,
?????dataType: "json",
?????data: data,
?????success: function(response) {
??????if ( response ) {
???????var submitted = validator.formSubmitted;
???????validator.prepareElement(element);
???????validator.formSubmitted = submitted;
???????validator.successList.push(element);
???????validator.showErrors();
??????} else {
???????var errors = {};
???????errors[element.name] =? response || validator.defaultMessage( element, "remote" );
???????validator.showErrors(errors);
??????}
??????previous.valid = response;
??????validator.stopRequest(element, response);
?????},
??????? error:function(e){
??????? ?alert("页面已过期,自动刷新页面");
??????? ?window.location.reload();
??????? }
????}, param));
????return "pending";
???} else if( this.pending[element.name] ) {
????return "pending";
???}
???return previous.valid;
??}

?

解决方法：

提交时

??jQuery("#code").data("previousValue").old = null;
??jQuery('#form2').submit();

将你的验证码输入框的previousValue的old值置为空，那么提交时，就会进行验证了。

附件里并非全部代码，缺少页面，仅供参考