亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

JQuery 驗證 - 字段不會取消突出顯示

JQuery 驗證 - 字段不會取消突出顯示

慕工程0101907 2023-09-28 09:51:46
我有一個非?;镜谋韱危渲邪?Jquery 驗證。要求:如果姓名字段不為空,則需要地址,否則不需要。這工作正常,唯一的問題是紅色突出顯示永遠不會消失,即使字段變得有效。重現:添加一些文本First Name,然后點擊Save按鈕。預期結果:所有必填字段將突出顯示并帶有錯誤文本。從中刪除文本First Name,然后點擊Save按鈕預期結果:突出顯示和錯誤文本應該消失。 實際結果:錯誤文本消失,但突出顯示不會消失。這個問題有解決辦法嗎?  $(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條經驗 獲得超13個贊

這就是我目前正在解決的方法。我仍然覺得這是一個黑客,但在我找到一個好的解決方案之前,我一直堅持這個。

  1. 為所有需要被視為組的控件添加了自定義類。

  2. 期間unhighlight,從用此自定義類裝飾的所有元素中刪除錯誤類。另外,刪除label錯誤消息的元素。

    unhighlight: function (input) {

            $(input).removeClass("error");


            if (isNameEmpty()) {

              $(".custom-class").removeClass("error");

              $(".custom-class").siblings("label").remove();

            }

        }

注意:該溶液需要謹慎使用。此處僅根據一個條件刪除錯誤,因為這是我的控件需要的唯一驗證。但是,如果單個控件(例如最小值、最大值等)與 一起進行多個驗證required,則使用此代碼將消除所有錯誤。



查看完整回答
反對 回復 2023-09-28
  • 1 回答
  • 0 關注
  • 109 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號