jQuery 覆盖 event.preventDefault()

Question

我有一个表单，当提交时，它会通过通常的e.preventDefault()并发送一个 ajax 请求。 但是，如果这个ajax请求返回某个条件，我希望表单能够正常提交。 我如何实现这一目标？

// Submit handler
$(".reserveer_form").submit(function(event){
  event.preventDefault();

  $.ajax({
    url: $(this).attr("action"),
    data: $(this).serialize(),
    success: function(data) {
      if($(".messagered",data).length > 0){
        var errors = $(".messagered",data);
        $(".gegevens").before(errors);
      } else {
          // SUBMIT THE FORM!
      } 
      
    }
  });

})

Answer 1

在表单上调用本机submit方法，这样它就不会触发 jQuery 处理程序。

$.ajax({
    context: this, // <-- set the context.
    url: $(this).attr("action"),
    data: $(this).serialize(),
    success: function (data) {
        if ($(".messagered", data).length > 0) {
            var errors = $(".messagered", data);
            $(".gegevens").before(errors);
        } else {
            this.submit(); // <-- submit the form
        }
    }
});

Answer 2

由于您的评论说您更改了表单变量，因此您可以通过检查相同的表单变量来启动submit处理程序。 如果它被改变了，就return true 。 如果不是，则继续当前处理程序。

Answer 3

您可以使用submit()方法或表单：

$(".reserveer_form").submit(function(event){
  event.preventDefault();
  var form = this,
      $form = $(form);

  $.ajax({
    url: $form.attr("action"),
    data: $form.serialize(),
    success: function(data) {
      var errors = $(".messagered", data);
      if (errors.length > 0){
        $(".gegevens").before(errors);
      } else {
        form.submit();
      }
    }
  });
})

但是，这似乎是一个奇怪的 ajax 请求。 首先，您将表单（通过 ajax 序列化）发送到服务器，当响应不包含任何错误时您再次发送它？ 服务器将处理它两次（并执行两次，具体取决于您的表单）。 此外，用户不会收到他的输入已被处理的消息——他点击“提交”，并且它总是需要一段时间才能被明显地提交（他甚至可以更改一些输入）。