jquery - 拦截提交按钮的点击并检查表单 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。

编辑:
示例处理程序绑定(bind)到 click 事件，因为您想要

to check validity of form on clicking the submit button

最好使用 .submit() 而不是 .click()，以便对任何类型的表单提交进行验证。 我们的样本几乎保持不变:

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