为什么 jQuery 表单在第一次点击时没有提交

Question

我有一个弹出模式，它在验证后提交到 ajax 页面。验证和提交工作正常。但是唯一的问题是，在第一次单击时，它没有提交表单或验证。第二次单击时，它工作正常。

法典：

<script>
      $(function () {
        $('form').on('submit', function (e) {
          e.preventDefault();
          $('#gen-bar-form').validate({
                ignore: [],
                rules: { 
                        firstName: {
                            required: true
                        },
                        editor: {
                            required: true
                        }
                },
          submitHandler: function(form) {
             $("#loader-bg").css("visibility", "visible");
          $.ajax({
            type: 'post',
            url: 'action/file.php',
            data: $('form').serialize(),
            success: function (data) {
            var GenTokRet = JSON.parse(data);
            $("#gen-msg").html("<p>"+GenTokRet+"<p>");
            $("#loader-bg").css("visibility", "hidden");  
            }
          });
          }
          }); 
        });
      });
    </script>

Answer 1

你做错了，因为，你正在使用阻止默认函数来停止表单，尽管jQuery验证将自动停止提交表单，直到它有效。所以只需要在提交函数上键入验证函数