结合JQueryvalidation，然后是ajax发布

我确信这很简单，但我是JQuery的新手。 我使用JQuery插件validation电子邮件地址，这是有效的，代码是：

$(document).ready(function () { $("#email").click(function () { $(this).attr({value: ''}); }); $("#subscribe-form").validate(); }); 

我当时想要做的是使用ajaxpost发布电子邮件地址，再次这个代码在没有validation器的情况下工作正常：

 $(document).ready(function () { $('#submit').click(function () { var email = $('#email').val(); var data = "email=" + email; $.ajax({ type: "POST", url: "subscript.php", data: data, }); }); }); 

我似乎无法做到的是将它们两者结合起来，这样如果电子邮件有效，它就会发布。 我非常感谢有关如何做到这一点的帮助。

非常感谢

Answer 1

可以通过传入具有各种配置选项的对象来配置.validate() 。 在这种情况下，将submitHandler与回调设置为表单提交代码应该可以完成这项工作。

我还清理了一些示例代码，以向您展示如何编写更多惯用的jQuery。

1. 我使用了jQuery.post()而不是jQuery.ajax()因为jQuery.ajax()是一个低级方法，仅在你想要自定义AJAX请求的行为时使用，就像我们如何使用自定义.validate()的行为。

2. 可以通过调用.serialize()来准备发布表单的所有输入。 这将准备一个URL编码的键值字符串，如name=John+Doe&email=john%40doe.com ，然后可以作为POST的数据。

例

 $(document).ready(function() { $('#myForm').validate({ submitHandler: function(form) { $.post('subscript.php', $('#myForm').serialize()); } }); }); 

Answer 2

你应该能够使用submitHandler选项，它本质上是一个回调函数，在validation表单时调用它：

 $('#submit').click(function () { $("#subscribe-form").validate({ submitHandler: function(form) { //do submit } }); }); 

当表单有效时，回调处理实际提交。 获取表单作为唯一参数。 替换默认提交。 在validation后通过Ajax提交表单的正确位置。

Answer 3

在调用ajax调用validation之前，您可以执行以下操作：

  if (!$('form').valid()) { return false; } 

Answer 4

在进行.ajax()调用之前，请在继续使用if ($('#subscribe-form').valid()) { ... }之前检查表单是否有效。