慕工程0101907
2023-09-28 09:51:46
我有一個非常基本的表單,其中包含 Jquery 驗證。要求:如果姓名字段不為空,則需要地址,否則不需要。這工作正常,唯一的問題是紅色突出顯示永遠不會消失,即使字段變得有效。重現(xiàn):添加一些文本First Name,然后點擊Save按鈕。預期結(jié)果:所有必填字段將突出顯示并帶有錯誤文本。從中刪除文本First Name,然后點擊Save按鈕預期結(jié)果:突出顯示和錯誤文本應該消失。 實際結(jié)果:錯誤文本消失,但突出顯示不會消失。這個問題有解決辦法嗎? $(document).ready(function() { isNullOrWhitespace = function(input) { return !input || !input.trim(); }; isNameEmpty = function() { var name = $("#FirstName").val() + $("#LastName").val(); return isNullOrWhitespace(name); }; $("#application").validate({ rules: { FirstName: { required: function() { return !isNameEmpty(); } }, LastName: { required: function() { return !isNameEmpty(); } }, Address1: { required: function() { return !isNameEmpty(); } }, City: { required: function() { return !isNameEmpty(); } }, Zip: { required: function() { return !isNameEmpty(); } }, SomeOtherField: { required: true }, }, highlight: function(input) { $(input).addClass("error"); }, unhighlight: function(input) { $(input).removeClass("error"); }, submitHandler: function(form) { alert("Submitted"); } }); });label.error { color: #dc3545 !important;}input.error { border: 1px solid #dc3545 !important;}input.input-validation-error { border: 1px solid #dc3545 !important;}select.input-validation-error { border: 1px solid #dc3545 !important;}
1 回答

開滿天機
TA貢獻1786條經(jīng)驗 獲得超13個贊
這就是我目前正在解決的方法。我仍然覺得這是一個黑客,但在我找到一個好的解決方案之前,我一直堅持這個。
為所有需要被視為組的控件添加了自定義類。
期間
unhighlight
,從用此自定義類裝飾的所有元素中刪除錯誤類。另外,刪除label
錯誤消息的元素。
unhighlight: function (input) {
$(input).removeClass("error");
if (isNameEmpty()) {
$(".custom-class").removeClass("error");
$(".custom-class").siblings("label").remove();
}
}
注意:該溶液需要謹慎使用。此處僅根據(jù)一個條件刪除錯誤,因為這是我的控件需要的唯一驗證。但是,如果單個控件(例如最小值、最大值等)與 一起進行多個驗證required
,則使用此代碼將消除所有錯誤。
添加回答
舉報
0/150
提交
取消