0
3フィールドのSSNを検証しようとしています。私はこれらのフィールド（と私のフォーム上の他のフィールド）をオンザフライで検証し、フィールドが有効であれば緑色のチェックを表示し、そうでない場合は赤色のxとエラーメッセージを表示します。jQueryグループの検証と初期の成功
問題は、私が現在セットアップしている方法では、最初のSSNフィールドの後に成功関数が発火し、他の2つのフィールドが入力される前に緑色のチェックマークが表示されます。もちろん、2番目のフィールドを離れるとエラーになりますが、どのように設定すれば3番目のフィールドが入力された後にこのグループが検証されるだけですか？コードは以下の通りです。
$('form').validate({
onfocusout: function(element) { $(element).valid(); } ,
rules: {
tbSSN1: {required: true, minlength: 3, regexp: /^[0-9]*$/},
tbSSN2: {required: true, minlength: 2, regexp: /^[0-9]*$/},
tbSSN3: {required: true, minlength: 4, regexp: /^[0-9]*$/},
DOBMonth: {required: true},
DOBDay: {required: true},
DOBYear: {required: true}
},
messages: {
tbSSN1: 'Please enter your SSN to retreive your free credit scores.',
tbSSN2: 'Please enter your SSN to retreive your free credit scores.',
tbSSN3: 'Please enter your SSN to retreive your free credit scores.',
DOBMonth: 'Please enter your DOB to retreive your free credit scores.',
DOBDay: 'Please enter your DOB to retreive your free credit scores.',
DOBYear: 'Please enter your DOB to retreive your free credit scores.'
},
groups: {
SSN: "tbSSN1 tbSSN2 tbSSN3",
DOB: "Month Day YearDropDown"
},
errorElement: "span",
highlight: function(element, errorClass) {
var ep = $(element).parent();
console.log(ep.find('label'));
$(element).addClass('error');
ep.find('label').css('color','red');
ep.find('span.errorX').remove();
ep.find('label').after('<span class="errorX"></span>');
},
success: function(label) {
var lp = $(label).parent();
label.addClass("valid");
lp.find('input').removeClass('error');
lp.find('label').css('color','black');
lp.find('span.errorX').remove();
}
}）;