使用parsley.js提交异步表单

我正在尝试创建一个使用Parsley.jsvalidation前端的表单并异步提交。 该表单称为#contactForm，提交按钮为#sendData，当我在空表格或无效表单上点击提交时出现错误。 我希望从无效的表单数据中看到“错误”警报，但它只是继续使用Else条件，并且数据由contactForm.php处理。

---

$(document).ready(function() { // submit data on click and check if valid $('#sendData').click(function(e) { //check if valid with parsley var valid = $('#contactForm').parsley ( 'validate' ); if ( valid === false ) { e.preventDefault(); } else { $.post("contactForm.php", $("#contactForm").serialize()); } }); }); 

---

适当的解决方案如下。

Answer 1

这是您的代码应该是什么样子。

 $(function() { $('#contactForm').submit(function(e) { e.preventDefault(); if ( $(this).parsley().isValid() ) { $.post("contactForm.php", $(this).serialize()); } }); }); 

• 您希望捕获表单提交事件，而不是单击提交按钮。 （还有其他提交表单的方法 – 比如按Enter键 – 不会触发点击，但也必须处理。）
• 您始终希望阻止默认操作。 您通过Ajax提交表单，因此您实际上从不想以传统方式提交表单。
• 没有必要明确地比较=== false 。 （当表格有效时，欧芹将返回一个真值，只需使用它。）
• $(document).ready(function() { ... is $(function() { ...
• 安置一种方式来放置花括号。 （JS中最常见的约定是“非对称”，即{在启动语句的一行上。）
• 你的意见是多余的。 （他们确切地说出了代码所说的内容，因此不需要它们。）

---

编辑：在旧版本的parsely（2.x之前），使用

 if ( $(this).parsley('validate') ) { // ... } 

Answer 2

这对我有用：

 
 (....) 
  

是的，它是从parsleyjs.org示例中复制的。 但它工作正常！