Jquery Ajax和脚本表单验证

Question

我有一个表单，它使用脚本执行表单验证，但我使用的是jquery ajax。在添加ajax之前，表单验证可以正常工作。一旦我添加了ajax，就像表单不再验证一样。ajax只是对表单求和，而不进行验证。这就像是ajax绕过了验证。

      <script type="text/javascript">
      jQuery('form').delay(3000).submit(function() {
      string = jQuery("form").serializeArray();

      jQuery.ajax({
    type: "POST",
    url: "../script_insert.php",
    data: string,
    dataType: "html",
    success: function(html){
      jQuery('#Right_Content').hide().html(html).fadeIn("slow");;

       }
       })
       return false;
       });
       </script>

但是，当我从页面中删除所有的ajax时，它工作得很好。页面已验证。谁能告诉我如何确保表单验证发生在ajax提交之前。我尝试了jquery延迟，但这也不起作用。谢谢。

Answer 1

为什么不把验证作为.submit()做的第一件事呢？这样，无论有多少表单域具有焦点，您都可以确保表单是有效的。

jQuery('form').submit(function() {
    if (validate()) {
        string = jQuery("form").serializeArray();
        ...
    } else {
        return false;
    }
});

Answer 2

1. 为了防止进一步的错误，我建议您使用提交的绝对路径。使用完整路径"url="http://www.yoursite.com/script_insert.php"

代替url="../script_insert.php"

2.听起来你的脚本中没有“防止默认”。您必须做两件事:在加载输入和显示错误的div之前清除它们！

第2点:您可以将ajax提交替换为放在

`"$(document).ready(function(){
$('#your_form').submit(function(){
$.post("http://your_site.com/script_insert.php",{ first_variable:$('#first_input_field').val(),second_variable:$('#second_input_field').val(),rand:Math.random()},function(data){
if(data=='yes'){do something}
if(data=='no'){do something else}});
return false;});
});
    });'

在PHP验证中，如果输入正确且表单有效，则回显"yes“，否则回显"no”。或者其他任何你想要的词。这也允许更大的灵活性。编辑以上内容以满足您的需要。添加你想要的变量，这样一切都是jQuery的。如果你想看到一个有效的例子，给我发一条私人消息，我会告诉你它是如何工作的。使用上面的代码，我从来没有遇到过任何问题。据我所知，jQuery还会在发送post请求之前自动清理输入，这为您提供了某种形式的安全性。