JQuery反復検査による二重提示の問題記録
2267 ワード
一、背景
最近JQuery Validateでフォームチェックをする時、ユーザー名をチェックする必要があるため:1、登録規則に合うかどうか;2、空かどうか;3、登録されているかどうか.4、特殊文字が含まれているかどうか、しかし問題が来て、初めてクリックするのは検査が空ではありませんが、不正なユーザー名を入力すると登録規則に合わないことを提示して、それを削除して、この時に上述の問題が現れました:非空を検査して、また登録規則を検査しました.
二、解決方法
実は解決策も比較的簡単で、新しい入力時に前回のエラーチェックをクリアしてから入力した内容を再チェックし、前に入力した内容が間違っているかどうかにかかわらず、同時に1つの内容だけをチェックすることができます.
三、コード例
$("#submitFormId").validate({
onkeyup : false,
//errorClass : "errormessage",
//errorClass : 'error',
//validClass : 'valid',
errorClass: 'error',
validClass: 'valid',
onfocusout: function(element){
var elem = $(element);
elem.valid();
},
success : function(element) {
//alert(element.attr("id"));
//$.noop;
var elem = $(element);
elem.poshytip('disable');
elem.poshytip('destroy');
},
errorPlacement : function(error, element){
var elem = $(element);
//
elem.poshytip('disable');
elem.poshytip('destroy');
//
if (!error.is(':empty')) {
// :x=right;y=center
// :x=left;y=center
// :x=inner-left
// :x=center;y=bottom
var aX = "right";
if (elem.attr("positionX") != null) {
aX = elem.attr("positionX");
}
var aY = "center";
if (elem.attr("positionY") != null) {
aY = elem.attr("positionY");
}
if("SELECT"==elem.get(0).tagName){
elem.filter(':not(.valid)').poshytip({
showTimeout: 0,
showOn : 'none',
content : error,
alignTo : 'target',
alignX : aX,
alignY : aY,
offsetX : 5,
offsetY : 5
});
}else{
elem.filter(':not(.valid)').poshytip({
showTimeout: 0,
showOn : 'hover',
content : error,
alignTo : 'target',
alignX : aX,
alignY : aY,
offsetX : 5,
offsetY : 5
});
}
} else {
elem.poshytip('disable');
elem.poshytip('destroy');
}
},
highlight:function(element, errorClass, validClass) {
$(element).removeClass('valid').addClass('error');
}
});
});