jquery form.each 函数的递归错误过多 bootstrap 验证

Question

在我需要在页面上放置多个表单之前，使用 Bootstrap 验证器 (http://formvalidation.io/) 的表单没有控制台错误。现在，当我运行 $(form).each() 时，我得到了太多的递归错误。

    $('form').each(function(){
        var form_id = $(this).attr("id");
        $(this).bootstrapValidator({
            message: 'This value is not valid',
            fields: {
                email: {
                    validators: {
                        notEmpty: {
                            message: 'The email is required and cannot be empty'
                        },
                        emailAddress: {
                            message: 'The input is not a valid email address'
                        }
                    }
                }                   
            }
        }).on('success.form.bv', app.form_handler);
    });

这是 javascript app.form_handler:

app.form_handler = function( evt ){
    evt.preventDefault();
    app.$ajax_form = $(evt.target);
    var serialized_data = app.$ajax_form.serialize();
    app.post_ajax( serialized_data );
};

然后 post_ajax 函数...

 app.post_ajax = function( serial_data ){
    var post_data = { 
        action     : 'cm_ajax',
        nonce      : cm_ajax.nonce,
        serialized : serial_data,
    };

    $.post( cm_ajax.ajax_url, post_data, app.ajax_response, 'json' )
};

Answer 1

如果存在不遵循 Bootstrap 表单结构的表单，则可能会发生 Too Much Recursion Error issue。请参阅 Writing form 部分。

同时，$(form)实际上会选择页面中的所有表单。因此，要么检查页面上的所有表单以确保它们都使用标准的 Bootstrap 表单标记，要么使用更严格的选择器，例如 $('#form1, #form2')

Answer 2

这触发了一个错误，因为我以管理员身份登录到 WordPress（这意味着页面上有很多隐藏的表单）。因此，$(form).each 函数在每个未使用标准 Bootstrap 标记的表单上运行ning，从而触发了错误。

我通过向我希望验证器运行开启的表单添加自定义 class 来修复此问题，然后仅向运行验证器添加一个 IF 子句 if($( this).hasClass('bootstrapFormClass')){ ... }

这工作正常，现在是验证器，我的所有表格都工作正常。

jquery form.each 函数的递归错误过多 bootstrap 验证

jquery too much recursion error on form.each function with bootstrap validation

jquery

recursion

bootstrapvalidator