jquery validate remote扩展使用
jquery的validate功能可以方便的用来验证前端数据，有些时候验证数据需要提交后端进行验证，可以使用validate的remote的功能，代码如下：
$('#firstForm').validate({
rules: {
account: {
hasselected: true
},
amount: {
required: true,
isValidAmount: true,
maxlength: 13
},
validatecode:{
required:true,
remote:{
type:"POST",
url:"",
date:{name:function(){return $("#validate").val();}}
}
},
},
messages: {
account: {
hasselected: "请选择帐号！"
},
amount: {
required: "金额不能为空！",
isValidAmount: "金额输入错误，请重新输入！",
maxlength: "金额已超出最大长度"
},
validatecode:{
required:"未填写验证码!",
remote:jQuery.format("验证码错误")
}
},
errorElement: "span",
errorPlacement: function (error, element) {
//查找到需要容纳并显示错误信息的dom元素
//var attentionElement = $(element).next().children('.ui-tiptext-error');
var attentionElement = $(element).parent().parent().find('.ui-tiptext-error');
attentionElement.show();
//传过来的error是包含span标签的错误信息，如果要去掉标签，用正则表达式即可
attentionElement.find("span").html(error);
},
showErrors: function (errorMap, errorList) {
if (errorList && errorList.length > 0) {
$.each(errorList, function (index, obj) {
$(obj.element).parent().next().children('.ui-tiptext-error').show();
});
this.defaultShowErrors();
} else {
$(this.currentElements).parent().next().children('.ui-tiptext-error').hide();
}
},
onkeyup: false,
focusInvalid: false
});
但是这样使用时候url返回值必须为true和false，否则就需要自定义扩展，定义verifyValidate方法
$('#firstForm').validate({
rules: {
account: {
hasselected: true
},
amount: {
required: true,
isValidAmount: true,
maxlength: 13
},
validatecode:{
required:true,
verifyValidate:true
},
},
messages: {
account: {
hasselected: "请选择帐号！"
},
amount: {
required: "金额不能为空！",
isValidAmount: "金额输入错误，请重新输入！",
maxlength: "金额已超出最大长度"
},
validatecode:{
required:"未填写验证码!",
remote:jQuery.format("验证码错误")
}
},
errorElement: "span",
errorPlacement: function (error, element) {
//查找到需要容纳并显示错误信息的dom元素
//var attentionElement = $(element).next().children('.ui-tiptext-error');
var attentionElement = $(element).parent().parent().find('.ui-tiptext-error');
attentionElement.show();
//传过来的error是包含span标签的错误信息，如果要去掉标签，用正则表达式即可
attentionElement.find("span").html(error);
},
showErrors: function (errorMap, errorList) {
if (errorList && errorList.length > 0) {
$.each(errorList, function (index, obj) {
$(obj.element).parent().next().children('.ui-tiptext-error').show();
});
this.defaultShowErrors();
} else {
$(this.currentElements).parent().next().children('.ui-tiptext-error').hide();
}
},
onkeyup: false,
focusInvalid: false
});
jQuery.validator.addMethod("verifyValidate", function(value, element) {
var flag = true;
// ajax获取
$.ajax({
type : 'POST',
url : "",
dataType : 'json',
async : false,
cache : false,
data : "valid=" + value,
success : function(data) {
console.log("验证验证码" + data);
var code = data.code;
if(code=='00000'){
flag = true;
}else if(code=='00001'){
flag = false;
$('#img').attr('src', '/url?' + new Date().getTime());
$('#msg').html("验证码已失效");
$('.msg').show();
}else if(code=='00002'){
flag = false;
$('#img').attr('src', '/url?' + new Date().getTime());
$('#msg').html("验证码错误");
$('.msg').show();
}
}
});
return flag;
}, "");