所以这就是问题所在。我有一个使用 Jörn Zaefferer 的 jQuery Validation 插件进行验证的表单。我的验证工作正常,除了一个组件,即远程验证。实际上,远程验证确实有效,但未达到预期。当我在用户名输入中输入一些数据并“关注”时,数据会在服务器上进行验证,并且根据用户名的可用性,服务器会以字符串 true 或 false 进行响应。现在,在客户端,我希望验证插件根据服务器的响应将“错误”或“有效”类添加到输入元素。当插件从服务器接收到错误的响应字符串时,它确实添加了“错误”类,但在接收到真实的响应字符串时未能添加“有效”类。
如果在用户名输入内部单击并第二次聚焦,则更加神秘,瞧!添加了有效的类。需要注意的一点:由于输入字段数据没有更改,因此远程 Ajax 验证不会在第二个焦点上运行。该插件只是根据从服务器收到的最后一个响应(我认为)添加类。诡异的。
最初,我认为问题可能是由于异步 Ajax 造成的。但我将其更改为同步。问题依然存在。我已经在 Firebug 控制台中彻底检查了服务器的响应。我可以看到“真”或“假”字符串(不带引号)作为响应。
我还添加了 errorLabelContainer (虽然我不需要它)来检查它是否收到任何东西。同样,在错误时,errorLabelContainer 选择器会收到错误消息,但在成功时它保持空白。
我需要设置有效的类,因为我使用它来更改 CSS 中的输入背景,以便向用户提供视觉指示。
这是我拥有的验证代码:
$('.registration-form').validate({
debug : true,
onkeyup : false,
errorLabelContainer: '.message-box',
onfocusout : function(element) { var isvalid = $(element).valid(); console.log(isvalid); },
rules : { username : { required: true, alphanumeric: true, minlength: 3, remote: { url : ajaxVars.ajaxurl,
type :'POST',
async : false,
cache : false,
timeout : 5000,
data : { action: 'check_username',
username: function() { return $('input[name="username"]').val(); },
_ajax_nonce: ajaxVars._ajax_nonce
}
}
},
email : { required: true, email: true, remote: { url : ajaxVars.ajaxurl,
type :'POST',
async : false,
cache : false,
timeout : 5000,
data : { action: 'check_email',
email: function() { return $('input[name="email"]').val(); },
_ajax_nonce: ajaxVars._ajax_nonce
}
}
},
password : { required: true, minlength: 5 },
}, // end rules
messages : { username : { required : 'Please enter a username.',
alphanumeric : 'Your username must be atleast 3 characters long and must only include alphabets, numbers or an underscore.',
minlength : 'Your username must be atleast 3 characters long and must only include alphabets, numbers or an underscore.',
remote : 'This username is already taken!'
},
email : { required : 'Please enter an email address.',
email : 'Please enter a valid email address.',
remote : 'This email is already registered!'
},
password : 'Please provide a password for your new account. The password must be atleast 5 characters long.',
}, // end messages
submitHandler : function(form) {
$(form).ajaxSubmit({
success : show_reg_response,
url : ajaxVars.ajaxurl,
type : 'POST',
timeout : 10000,
clearForm : true,
resetForm : true
});
} // end submitHandler
});