jQuery驗證 - 消防定製'addMethod'焦點/按鍵

我已經爲jQuery驗證創建了幾個自定義驗證方法。一個用於密碼強度測試。我希望在輸入第一次集中時觸發它，所以它會驗證用戶類型是否提供實時反饋，而不僅僅是表單提交。jQuery驗證 - 消防定製'addMethod'焦點/按鍵

編輯：驗證只在提交表單時運行，我希望它在用戶輸入密碼時運行，以便他們獲得關於密碼強度的實時反饋。

理想情況下，我只想要這個實時驗證工作在選定的領域。即在提交表單之前，帳戶電子郵件地址不應該以這種方式行事，或者在完成輸入之前，它會一直提醒他們地址無效。但是，如果它只適用於所有元素，我會接受它的形式。

那麼，是否有可能在提交表單之前調用jQuery驗證焦點/鍵盤上的其他方法？

這是我想要調用的新方法。

$.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'); 
} 
}, '');

來源

2012-08-03 Richard Le Poidevin

您有什麼問題需要我們幫助您解決？ – 2012-08-06 19:50:10

只是一個想法......我可以從我的方法上面拿出膽量，並將其包裹在一個新函數中，並將其綁定到我想要的事件上。然後問$ .validator.addMethod（'passwordStrength'....來調用我的新函數？ – 2012-08-07 07:07:38

我最終將該方法的主要工作轉移到一個單獨的函數中，這個函數被我的方法調用。然後我將函數綁定到密碼輸入。我選擇了input事件，因爲這個事件在按鍵時發生，並且發生了變化 - 它非常靈活但經常被人遺忘。

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

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

passwordStrength與我的問題相同。

來源

2012-08-09 08:09:03

jQuery驗證 - 消防定製'addMethod'焦點/按鍵

回答

相關問題