清除jQuery对话框打开后验证

Question

我在我的代码中遇到类似的行为：https://codepen.io/iw3/pen/BAdIq

html

<input id="open" type="button" value="Open" />
<div id="dialog">
  <form id="form">
    <input type="text" name="field" />
  </form>
</div>

JS

$(function () {
  $('#dialog').dialog({
    autoOpen: false,
    buttons: {
      'Send': function() {
        if ($('#form').valid()) {
          alert('Success');
          $('#dialog').dialog('close');
        }
      }
    }
  });
  $('#open').on('click', function() {
    $('#dialog').dialog('open');
  });
  $('#form').validate({
    rules: {
      field: {
        required: true,
        digits: true,
        maxlength: 9,
        min: 1
      }
    }
  });
});

[当用户在表单中输入数据并收到错误，然后关闭表单并重新打开它时，红色的验证消息仍然保留，而实际上应该清除它们。这是预期的行为还是有办法重置验证？

Answer 1

或者，您可以保存对validator的引用，并在对话框关闭时调用resetForm()：

let validator = $('#form').validate({
  rules: {
    // your rules...
  }
});

$('#dialog').dialog({
  autoOpen: false,
  close: function() {
    validator.resetForm();
  },
  // other configuration settings...
});