[英]Validate password rule on the fly
I've a user registration form and the user need to enter password. 我有一个用户注册表,该用户需要输入密码。 I've some password rules like must contain 8 characters, numbers and Upper case etc.
我有一些密码规则,例如必须包含8个字符,数字和大写字母等。
How can I show if the user met the password criteria while typing and showing it in a small popup or something similar? 如何显示用户在键入文字并在小弹出窗口或类似内容中显示密码时是否满足密码条件?
Currently I've code that shows a tick mark only if he met these criteria(like 8 chars,1 upper case and 1 digit) 目前,我的代码仅在满足以下条件时才显示刻度线(例如8个字符,1个大写字母和1个数字)
<td>
<table><tr>
<td>
<input type="password" name="password"
size="25" tabindex="<%= get_next_tabindex(@content_data) %>"
value="<%= @content_data['password'] %>"
onKeyUp="validatePassword(this)">
</td>
<td id="password_Valid_Image" style="display:none">
<%= image_tag(
"/assets/20/tick-icon.png",
:alt => "") %>
</td>
</tr>
</table>
</td>
var is_Password_Valid = false;
var lower_Case = ["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z"];
var upper_Case = ["A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"]
var numbers = [1,2,3,4,5,6,7,8,9,0]
function validatePassword(password_Input){
is_Password_Valid = true;
if(password_Input.value.length < 8){
is_Password_Valid = false;
drawPasswordValid(is_Password_Valid);
return;
}
var found_Chars = 0;
for(var i=0; i<lower_Case.length; i++){
if(password_Input.value.indexOf(lower_Case[i]) > -1){
found_Chars++;
}
}
if(found_Chars == 0){
is_Password_Valid = false;
drawPasswordValid(is_Password_Valid);
return;
}
found_Chars = 0;
for(var i=0; i<upper_Case.length; i++){
if(password_Input.value.indexOf(upper_Case[i]) > -1){
found_Chars++;
}
}
if(found_Chars == 0){
is_Password_Valid = false;
drawPasswordValid(is_Password_Valid);
return;
}
found_Chars = 0;
for(var i=0; i<numbers.length; i++){
if(password_Input.value.indexOf(numbers[i]) > -1){
found_Chars++;
}
}
if(found_Chars == 0){
is_Password_Valid = false;
drawPasswordValid(is_Password_Valid);
return;
}
drawPasswordValid(is_Password_Valid);
}
Take a look on existing jQuery plugins: 10 Password Strength Meter Scripts For A Better Registration Interface 看看现有的jQuery插件: 10个密码强度仪脚本,提供更好的注册界面
function check(str) {
var length = new RegExp('^[\\d\\w]{6,}$');
var digit = new RegExp('[\\d]+');
var upper = new RegExp('[A-Z]+');
return length.test(str) && digit.test(str) && upper.test(str);
}
alert(check('asasasA77'));
code: http://jsfiddle.net/wYDej/1/ 代码: http : //jsfiddle.net/wYDej/1/
如果您不是在寻找强度计,而只是想向用户显示一些信息,请查看jQuery气泡弹出窗口: http : //www.vegabit.com/jquery_bubble_popup_v2/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.