清除 jQuery 对话框在打开时验证

Posted 2023-05-09

【中文标题】清除 jQuery 对话框在打开时验证

【英文标题】：Clearing jQuery Dialog validate upon open

【发布时间】：2020-08-13 20:12:57

【问题描述】：

我在我的代码中遇到了类似的行为：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
      
    
  );
);

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

【问题讨论】：

请注意，我们更喜欢这里的技术写作风格。我们轻轻地劝阻问候，希望你能帮助，谢谢，提前感谢，感谢信，问候，亲切的问候，签名，请你能帮助，聊天材料和缩写 txtspk，恳求，你多久了被卡住、投票建议、元评论等。只需解释您的问题，并展示您尝试过的内容、预期的内容以及实际发生的情况。

【参考方案1】：

要解决此问题，您只需在对话框关闭时隐藏验证错误label 元素：

$('#dialog').dialog(
  autoOpen: false,
  close: function() 
    $('label.error').hide();
  ,
  // other configuration settings...
);

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

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

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