使用 jQuery 验证和引导确认插件进行表单验证答案

【问题标题】：Form validation with jQuery validation and bootstrap confirmation plugin使用 jQuery 验证和引导确认插件进行表单验证
【发布时间】：2016-11-25 02:24:30
【问题描述】：

我有一个使用 jQuery 验证插件验证的表单。我在提交按钮上添加了引导确认。一切正常，除了当表单不再有任何错误时，我希望引导确认出现在提交按钮上。

我试过这样做：

HTML 代码：

<button type="submit" class="btn" id="submit_button" data-toggle="confirmation"data-popout="true">Submit</button>

jQuery 代码：

$("#submit_button").on('click', function(){
    if($('#form').valid()) {
        $(this).trigger("confirmation");
    }
});

但它什么也没做。我应该在 jQuery 验证中使用 submitHandler 吗？或者这不仅仅是可能的？

【问题讨论】：

将 button 更改为 <input type="button" />，因此它不会执行默认行为。

标签： javascript jquery html twitter-bootstrap jquery-validate

【解决方案1】：

我应该在 jQuery 验证中使用 submitHandler 吗？

当然可以。

为此使用submitHandler。 As per documentation，它仅在表单有效时触发，因此无需测试表单的有效性或使用另一个 click 处理程序。

$('#form').validate({
    // options, etc.
    submitHandler: function(form) { // fires when valid (and on button click)
        $("#selector").trigger("confirmation");
    }
});

【讨论】：