jQuery Validate-在焦点/按键上触发自定义'addMethod'

Question

我为jQuery Validate创建了两个自定义验证方法。 一种用于密码强度测试。 我希望在首先关注输入时触发此操作，因此它可以在用户类型提供实时反馈时进行验证，仅在表单提交时有效。

编辑：验证仅在提交表单时运行，我希望它在用户键入密码时运行，以便他们获得有关密码强度的实时反馈。

理想情况下，我只希望此实时验证在选定字段上起作用。 也就是说，在提交表单之前，该帐户的电子邮件地址不应该这样操作，否则在输入完该表单之前，它将不断提醒他们其地址无效。 但是，如果仅当将其应用于所有元素时才起作用，那么我将接受这种形式的表单。

因此，是否可以在提交表单之前在焦点/键上调用jQuery Validate附加方法？

这是我要调用的新方法。

$.validator.addMethod('passwordStrength', function(password, element, param) {
// add our password test to
if (typeof zxcvbn === 'function') {
    var passwordMeter = $('#' + $(element).attr('id') + 'meter');
    var passwordMeterStrength = passwordMeter.find('.strength');
    var passwordMeterTrack = passwordMeter.find('.track');
    var passwordMeterBar = passwordMeterTrack.children();
    var strengthValues = ['Very weak', 'Weak', 'Average', 'Good', 'Strong'];
    //passwordMeter

    // get values of the other inputs in this form
    var otherinputs = [];
    if (param) {
        for (var input in param['user_inputs']) {
            // get the value and add it to an array
            otherinputs.push($(param['user_inputs'][input]).val());
        }
    }

    // run the test!
    var strength = testPasswordStrength(password, otherinputs);

    // show the strength of the password
    passwordMeterStrength.text(strengthValues[strength.score]);

    // change the class of our bar. nice browsers will animate this in CSS!
    passwordMeterBar.removeClass().addClass('bar strength' + strength.score);


    // we must be two or better
    if (strength.score > 1) {
        return true;
    } else {
        return false;
    }
} else {
    console.error('strength test is not loaded');
}
 }, '');

Answer 1

我最终将方法的主要工作移到了由我的方法调用的单独函数中。 然后，我将该功能绑定到密码输入。 我选择input事件是因为它会在按键和更改时触发-它非常灵活，但经常被遗忘。

$.validator.addMethod('passwordStrength', function(password, element, param) {
    return passwordStrength(password, element, param);
}, '');

passwordEl.on('input', passwordStrength());

passwordStrength与我的问题相同。