拦截点击提交按钮并检查表单的有效性jQuery

Question

我想要点击提交按钮来检查表单的有效性。如果有效，表单应提交，否则不做任何事情。 我试过禁用提交按钮，并点击检查有效性，并启用它。 但我看到这种方法的两个问题。 1：在禁用的按钮上未检测到点击 2：即使我设法检测到点击，我可能会以无限循环结束。在启用按钮后的第二次点击将再次触发有效性检查等。

Answer 1

您应该使用event.preventDefault()。阅读：http://api.jquery.com/event.preventDefault/

粗糙的示例代码草案：

$('your-submit-button').click(function(event){ 
    if (! validate()) { 
     event.preventDefault(); 
     showErrors(); 
    } 
}) 

哪里validate()是你的验证功能，在验证的情况下返回false失败。

编辑：
样品处理程序绑定到click事件，因为你想

来检查点击提交按钮

这是更好的做法是使用.submit()，而不是形式的有效性.click()，用于验证任何类型的表单提交。 我们的样品几乎保持不变：

$('#your-form-id').submit(function(event){ 
    if (! validate()) { 
     event.preventDefault(); 
     showErrors(); 
    } 
})