jQuery 验证回调函数

Question

我目前在网页上使用一个轻量级框架内的表单。当用户提交无效数据时，会在表单顶部出现一个包含表单错误列表的 div。问题是：我需要一种 jQuery 验证回调来在错误 div 出现后调整轻量级框架的大小。据我所知，使用 jQuery 轻量级框架无法实现此功能。

- Vincent Catalano

---

你是指一个 lightbox iframe 吗？你是使用插件还是自己的脚本来验证表单？ - Jon

Answer 1

您需要提供无效的回调函数，您可以在此处找到记录，如下所示

$(".selector").validate({
    invalidHandler: function(form, validator) {
        var errors = validator.numberOfInvalids();
        if (errors) {
            //resize code goes here
        }
    }
})

- mcgrailm

---

我想到了在invalidHandler函数中处理所有错误显示和位置安排。谢谢！ - Vincent Catalano

在.validate已经被初始化/调用后，您将如何附加此处理程序？ - Maslow

Answer 2

或者，您可以使用errorPlacement回调函数来处理未通过验证的特定元素。例如，下面的代码使用errorPlacement回调将每个无效表单元素的父div标签的类设置为“error”，一旦该元素通过验证，就会删除“error”类：

form.validate({
        rules: {
            Name: {
                required: true
            },
            Email: {
                required: true
                , regex: "^[0-9a-zA-Z.+_\-]+@{1}[0-9a-zA-Z.+_\-]+\\.+[a-zA-Z]{2,4}$"
            }
        },
        messages: {
            Name: {
                required: "Please give us your name"
            },
            Email: {
                regex: "Please enter a valid email address"
            }
        },

        errorPlacement: function(error, element) {
            element.parent().addClass("error");
        },

        success: function(element) {
            $("#" + element.attr("for")).parent().removeClass("error");
        }
    });

- Sebastian G