匹配密碼

Question

我有一段密碼匹配的代碼。我想在輸入確認密碼字段時驗證每個帶有密碼字段的字符。

var npass = $('#password'); 
    var rpass = $('#confirmpassword'); 
    if(npass.val() != rpass.val()) { 
     Val.errors = true; 
     Val.showerrors = true; 
     $("#confirmpasswordError").html("must match"); 
     $("#confirmpasswordError").addClass('error-Yes-msg').show(); 
     $("#confirmpassword").addClass('error-input'); 
     return false; 
    } else { 
     $("#confirmpasswordError").removeClass('error-msg').html(''); 
     $("#confirmpassword").removeClass('error-input'); 
    } 

Answer 1

好像你應該這樣的代碼只是綁定到$("#confirmpassword").keydown()

Answer 2

你的問題很模糊。代碼中有一些錯誤嗎？你沒有得到你期望的結果嗎？你在看什麼？前提是你的密碼字段真的有id值（不是名稱）「密碼」和「confirmpassword」，並提供了他們input元件或類似的，那麼從根本上說應該工作，除了：

1. 你返回false當他們不匹配時，但他們沒有返回true（至少，不在您的引用代碼中）。所以，如果這是你調用的函數，並且你正在檢查返回值，那麼你將會看到一個錯誤的值。
2. 當他們不匹配時，您正在添加類error-Yes-msg，但在他們執行操作時不會刪除它（您正在刪除error-msg）。
3. 當您匹配時，您不會清除Val.errors和Val.showerrors。

應對那些，做了一下整理的：

var npass = $('#password'); 
var rpass = $('#confirmpassword'); 
var match = npass.val() == rpass.val(); 
Val.errors = Val.showerrors = !match; 

if(match) { 
    $("#confirmpasswordError").removeClass('error-Yes-msg').html(''); 
    $("#confirmpassword").removeClass('error-input'); 
} else { 
    $("#confirmpasswordError") 
     .html("must match") 
     .addClass('error-Yes-msg').show(); 
    $("#confirmpassword").addClass('error-input'); 
} 
return match; 

Answer 3

你明白了。你只需要將它綁定到框的keyup/keydown事件。

現場演示：http://jsfiddle.net/FPNBe/2/

$('#password, #confirmpassword').keyup(function() { checkPass(); }); 


function checkPass(){ 
    var rpass = $('#confirmpassword').val(); 
    var npass = $('#password').val(); 
    if(npass!= rpass) { 
     //Val.errors = true; 
     //Val.showerrors = true; 
     $("#confirmpasswordError").html("must match"); 
     //$("#confirmpasswordError").addClass('error-Yes-msg').show(); 
     //$("#confirmpassword").addClass('error-input'); 
     return false; 
    } else { 
     $("#confirmpasswordError").html("match!"); 
     //$("#confirmpasswordError").removeClass('error-msg').html(''); 
     //$("#confirmpassword").removeClass('error-input'); 
    } 
} 

Answer 4

這似乎像.keyup()/.keydown()會的工作，但它有點棘手有時。所以，試試Zurb的this plugin。它像一個魅力。

現在，你的代碼應該是這樣的：

var npass = $('#password'); 
var rpass = $('#confirmpassword'); 

rpass.bind('textchange', function (event, previousText) { 
    if(npass.val() != rpass.val()) { 
     Val.errors = true; 
     Val.showerrors = true; 
     $("#confirmpasswordError").html("must match"); 
     $("#confirmpasswordError").addClass('error-Yes-msg').show(); 
     $("#confirmpassword").addClass('error-input'); 
     return false; 
    } else { 
     $("#confirmpasswordError").removeClass('error-msg').html(''); 
     $("#confirmpassword").removeClass('error-input'); 
    } 
});