javascript - 提交前ajax表单验证如何？

Question

我正在对服务器上的 php 页面进行 ajax 跨域请求。我通过 ajax 将 html 表单发布到服务器上的 php 页面。客户端验证存在问题。

我不知道如何在发送表单之前在客户端进行验证。

html表单是标准表单，发布输入字段:姓名、姓氏、消息......我的 html 表单，客户端:

<script type="text/javascript">

    var output = $('.nesa');

     $(document).ready(function(){
     $("#form1").submit(function (e) {
     e.preventDefault();

    $.ajax({
        url: 'http://www.example.com/form.php',
        crossDomain: true, //set as a cross domain requests
        type: 'post',
        data: $("#form1").serialize(),
        beforeSend: function (){
        // add spinner
         $('.spinner').append('<img id="animacija" src="spinnersmall.gif" alt="Loading" />');
                   },

        success: function (data) {
            $(".nesa").html(data);
            alert("sent " + data);

        },

        error: function(){

            output.text('Message is not sent!');

        }

    });
});

});

如何验证？我尝试将代码放入 beforeSend 但没有成功。或者也许使用submitHandler？

想法是当用户单击提交时，验证开始，如果无法告诉“插入您的电子邮件地址”。现在，当我单击“提交”时，它将数据发送到服务器。我希望首先检查输入字段。

该表单实际上正在将数据发送到服务器，但只需要弄清楚如何进行验证。 ajax调用中的验证应该放在哪里？

谢谢

Answer 1

创建一个函数来验证返回 true/false 的表单。在 $.ajax 之前调用该函数。检查 return 是否为 false 然后返回..请参阅下面的示例...

if(!validateForm())
    return false;