Javascript 使用jquery validate在select2中输入有效答案后删除类(';有错误';)

Javascript 使用jquery validate在select2中输入有效答案后删除类(';有错误';),javascript,jquery,jquery-validate,jquery-select2,Javascript,Jquery,Jquery Validate,Jquery Select2,我使用select2进行下拉和jquery验证。输入有效输入后,错误类应该被删除,它正在处理文本等其他输入,但select保留该类。 我试着这样做: $.validator.setDefaults({ errorClass: 'help-block', errorElement: 'span', focusInvalid: true, highlight: function(element, errorClass, validClass) {

我使用select2进行下拉和jquery验证。输入有效输入后,错误类应该被删除,它正在处理文本等其他输入,但select保留该类。 我试着这样做:

$.validator.setDefaults({
    errorClass: 'help-block',
    errorElement: 'span',
    focusInvalid: true,
    highlight: function(element, errorClass, validClass)
    {

      var fieldtype = ($(element).hasClass('dateField') ? 'dateField' : 'normal');
      switch(fieldtype)
      {
        case "dateField":
          $(element).closest('.form-group').addClass('has-error');
          // $(element).select();
          break;
        default:
          $(element).closest('.form-group').addClass('has-error');
          break;
      }

    },
    unhighlight: function(element, errorClass, validClass)
    {
      if($(element).hasClass('select2-offscreen'))
      {
        $(element).closest('.form-group').removeClass('has-error');
        $(element).next('span').css({display: "block"});
      }
      else
      {
        $(element).closest('.form-group').removeClass('has-error');
      }   
    },

    errorPlacement: function (error, element) {
            var fieldtype = ($(element).hasClass('dateField') ? 'dateField' : 'normal');

            switch (fieldtype) {
                case "dateField":
                    if (window && window.console) {
                        console.log("Date type field type");
                    }
                    error.appendTo(element.parent().parent());
                    break;
                default:
                    if (window && window.console) {
                        console.log("Regular field type");
                    }
                    error.appendTo(element.parent());
                    break;
            }
        }
  });
  $('#employee-form').validate(
  {
    rules: {
            firstname: {
                alpha: true,
                required: true
            },
           },
messages: {.....
});
这是我的html:

<div class="form-group">
  <label class="col-sm-4 control-label" for="designation">Designation <span class="input-required">*</span></label>
  <div class="col-sm-7">
    <select name="designation_id" class="form-control" id="designations">
     <option></option>
     <option value="<?php echo $designation->id; ?>"><?php echo $designation->title; ?></option>
     </select>
  </div>
</div>

我手动尝试删除errorClass并将style=“display:none”添加到error元素,但它不起作用。请帮帮我。

我认为设置超时应该在这里完成这项工作。请更改您的验证插件设置,如下所示:

unhighlight: function(element) {
    if (jQuery(element).is('#designations')) {
        setTimeout(function(){
            $(element).closest('.form-group').removeClass('has-error');
        },50);
    }
}
并另外添加以下代码:

jQuery("#designations").on('change', function (evt) {
    $thisVal = jQuery("#designations").val();
    if($thisVal != '') {
        setTimeout(function(){
            jQuery("#test-form").validate().element('#designations');
        },100);
    }           
});

如果您仍然有问题,请发送url,我将为您测试。

我认为setTimeout应该在这里完成这项工作。请更改您的验证插件设置,如下所示:

unhighlight: function(element) {
    if (jQuery(element).is('#designations')) {
        setTimeout(function(){
            $(element).closest('.form-group').removeClass('has-error');
        },50);
    }
}
并另外添加以下代码:

jQuery("#designations").on('change', function (evt) {
    $thisVal = jQuery("#designations").val();
    if($thisVal != '') {
        setTimeout(function(){
            jQuery("#test-form").validate().element('#designations');
        },100);
    }           
});

如果您仍然有问题,请发送url,我将为您测试。

您是否有示例页面,或者您是否可以创建页面的JSFIDLE示例?您是否有示例页面,或者您是否可以创建页面的JSFIDLE示例?