动态验证密码规则

Validate password rule on the fly

本文关键字：规则 密码 验证 动态      更新时间：2023-09-26

我有一个用户注册表单，用户需要输入密码。我有一些密码规则，如必须包含8个字符，数字和大写字母等。

我如何显示如果用户符合密码标准，而键入并显示它在一个小的弹出窗口或类似的东西?

目前我的代码显示一个打勾标记只有当他满足这些条件(如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);
  }

看看现有的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'));

代码:http://jsfiddle.net/wYDej/1/

如果你不是在寻找一个强度计，你只是想向用户显示一些信息，检查jQuery气泡弹出:http://www.vegabit.com/jquery_bubble_popup_v2/

相关文章：