JQuery Validate - 使用函数重置表单，resetForm() 不起作用

Question

我正在使用 JQuery Validator，我在 stackoverflow 中看到了许多解决方案，将所有验证放在“var”中，然后使用这个“var”.resetForm() 来重置对象，但这在这里不起作用是我的JSFiddle以我的例子为例。

我稍后的意图:使用相同的表单，两种类型的 block ，内部具有不同的输入，当其中一个 block 发生更改时，我调用一种方法来重置验证，以便在尝试时可以再次重用验证提交。

 var validate = $('#cad_principal').validate({
      errorLabelContainer: $('.form_validate_message'),
      wrapper:'li',
      rules:{
        cad_pf_cpf:{required:true, minlength:11}
      },
      messages:{
        cad_pf_cpf:{required:"O campo CPF precisa ser preenchido.", minlength:"O campo CPF deve conter no mínimo 11 caracteres."}
      },
      submitHandler: function(form) {
        $(form).submit();
      }
  });

function cancelForm(){
    validate.resetForm();
}

Answer 1

您尝试调用的函数 (cancelForm()) 不存在。试试这个:

$(function() {  
    var validate = $('#cad_principal').validate({
        errorLabelContainer: $('.form_validate_message'),
        wrapper:'li',
        rules:{
            cad_pf_cpf:{required:true, minlength:11}
        },
        messages:{
            cad_pf_cpf:{required:"O campo CPF precisa ser preenchido.", minlength:"O campo CPF deve conter no mínimo 11 caracteres."}
        },
        submitHandler: function(form) {
            $(form).submit();
        }
    });

    $('#cad_principal a').click(function() { validate.resetForm(); });
});

基本上，您需要将代码包装在 DOMReady 事件内，然后使用事件绑定(bind)来挂接表单。请记住，只有当 DOM 准备就绪时，validate 才会包含变量。这是 working jsFiddle .