Question

我有这段代码，验证我的表格：

   jQuery("form#theform").validate({        
        rules: {
            email_again: {
                equalTo: "#email"
            }
        }
    });

然而，这是有效的，我需要做功能，而email_again不相等。我需要访问函数中的'element'。

所以，我猜答案可能看起来像

 rules: {
            email_again: {
                equalTo: "#email"
                invalidcallback: function(element){
                   // do sth with element
                }

            }
        }
    });

我在文档上找不到任何相关内容。

修改

Sparky几乎把我带到了那里：

    rules: {
        email: {
            required: true
        },
        email_again: {
            equalTo: "#email"
        }
    },
    highlight: function(element, errorClass, validClass) {
        // custom code for 'email_again' field
        if (element.name === "email_again") {
            console.log('email_again in error');
        }
        // default 'highlight' code below
        if (element.type === "radio") {
            this.findByName(element.name).addClass(errorClass).removeClass(validClass);
        } else {
            $(element).addClass(errorClass).removeClass(validClass);
        }
    }
}

现在，我需要知道被破坏的规则。我需要知道它是“equalTo”，以便我可以找到兄弟标签并为其添加一个类：

jQuery(element).siblings( 'label' ).addClass('error NotEqualTo');

或者，如果我有equalTo“比较器”（在这种情况下是#email），我可以自己做等于比较并做相应的addClass。

Answer 1

rules: {
    email_again: {
        // list of only methods/rules
        equalTo: "#email"  // <- this is a valid method/rule
        invalidcallback: function(element) { // <- INVALID - this is not a method/rule
            ....
        }
    }
}

当任何特定字段无效时，没有特定于任何特定字段的回调函数。您只能列出键：值对字段：rules对象文字中的规则。您所需的回调函数不是公认的规则。

然而，有a callback that's fired every time any field is invalid called highlight。使用封装您email_again字段的自定义代码的条件。请务必同时包含默认的highlight代码，否则您将破坏插件。

highlight: function(element, errorClass, validClass) {
    // custom code for 'email_again' field
    if (element.name === "email_again") {
        console.log('email_again in error');
    }
    // default 'highlight' code below
    if (element.type === "radio") {
        this.findByName(element.name).addClass(errorClass).removeClass(validClass);
    } else {
        $(element).addClass(errorClass).removeClass(validClass);
    }
}

概念证明DEMO：http://jsfiddle.net/r98g06kz/

修改：

由于您想要改变类的应用方式，只需调整默认代码......

highlight: function(element, errorClass, validClass) { if (element.type === "radio") { this.findByName(element.name).addClass(errorClass).removeClass(validClass); } else { if (element.name === "email_again") { // your custom class $(element).siblings( 'label' ).addClass('error NotEqualTo'); } else { $(element).addClass(errorClass).removeClass(validClass); } } }

然后您还需要unhighlight回调，如下所示......

unhighlight: function(element, errorClass, validClass) { if (element.type === "radio") { this.findByName(element.name).removeClass(errorClass).addClass(validClass); } else { if (element.name === "email_again") { // your custom class $(element).siblings( 'label' ).removeClass('error NotEqualTo'); } else { $(element).removeClass(errorClass).addClass(validClass); } } }

如果元素无效，请进行回调

1 个答案: