'Alajax' Jquery 简单表单提交。如果表单未经验证，如何防止提交？答案

【问题标题】：'Alajax' Jquery simple form submit. How to prevent submitting if form not validated?'Alajax' Jquery 简单表单提交。如果表单未经验证，如何防止提交？
【发布时间】：2016-04-22 09:59:57
【问题描述】：

我一直在寻找一个简单的 JQuery 插件，以便通过 Ajax 轻松提交表单，我发现 Alajax 很方便，因为它集成到典型的 HTML 表单中并完成所有工作。不幸的是，如果没有验证，我不明白如何防止表单被提交（官方网站的文档很差，作者也没有回复我的邮件）。

例如下面的表单是通过 Ajax 提交的：插件拦截表单，获取 'name' 属性并调用 send.php 作为普通表单

<form id="myform" action="send.php">
    <input type="text" name="firstname"
    <input type="submit" value="Submit">
</form> 

<script>
    $(document).ready(function (){
        $("#myform").alajax();
    });
</script>

Alajax 有一些 options 解释：

$('#myform').alajax({
    type: '' // Type of return value. Default is "text". Other values are: "json", "xml", "jsonp"
    beforeSend: function (){} // Code to run before sending the form
    success: function(){} // Code to run when the AJAX call success
    error: function(){} // Code to run when error occures
});

但是下面的代码还是提交了表单：

$('#myform').alajax({
    beforeSend: function (){
        // Validation code is here. Suppose that form is not validated,
        return false; // this should'nt stop submitting the form?
    }
});

beforeSend 选项中的代码已正确执行（我通过调用 console.log 对其进行了测试），但仍会提交表单。如何防止表单出现错误时提交？我也试过 preventDefault 没有成功。

【问题讨论】：

库从 beforeSend 函数中吞下您的返回值。看看它是如何被调用的：github.com/alaabadran/ALAJAX/blob/master/js/alajax.js#L41
我明白但我不明白。
从它的名字beforeSend 可以合理地认为，无论该函数中有什么，该请求都会在该函数执行后发送，因此您无法检查表单在那里是否有效。在发送 AJAX 请求之前执行此操作。

标签： javascript jquery ajax forms

【解决方案1】：

你不能用 alajax 阻止表单提交。但是您可以使用另一个提交侦听器来阻止事件到达 alajax。

<form id="myform" action="send.php">
  <input type="text" name="firstname">
  <input type="submit" value="Submit">
</form> 

<script>
  $(document).ready(function (){

    $("#myform").submit(function(e){
      e.preventDefault();
      if(/* form is invalid */){
        e.stopImmediatePropagation();
      }
    });

    $("#myform").alajax();
  });
</script>

编辑

还有另一种方法可以在 beforeSend 函数中 throw new Error('asd');。

【讨论】：