首页 | 麦客学吧 | 视频教程 | FLASH小游戏 | 素材下载 | 常用工具
您当前的位置:首页 > 程序开发 > JavaScript > 正文

javascript密码强度提示效果

出处:麦客学吧 [2008-8-19 9:52:39] 点击数:94
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="PasswordStrong._Default" %>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <input  id="reg_passwd__" name="reg_passwd__" value="" ;="" onkeyup="update_strength('reg_passwd__','reg_passwd__strength_display__')" autocomplete="off" type="password"/>
    <script type="text/javascript">
   function update_strength(input_field_id, output_display_id) 
    {
    var input_field = document.getElementById(input_field_id);
    var output_display = document.getElementById(output_display_id);
        
    var input_str = input_field.value;
    var input_length = input_str.length;

    var strength = 0;

    // increase strength if contains [0-9]
    number_re = new RegExp("[0-9]");
    if (number_re.test(input_str)) {
      strength++;
    }
    // increase strength if contains non alpha
    non_alpha_re = new RegExp("[^A-Za-z0-9]");
    if (non_alpha_re.test(input_str)) {
      strength++;
    }

    // increase strength if contains upper case
    upper_alpha_re = new RegExp("[A-Z]");
    if (upper_alpha_re.test(input_str)) {
      strength++;
    }
    
    // increase strength if long enough
    if(input_length >=8) {
      strength++;
    }    

    var strength_str; 
    if (strength <= 1) {
        strength_str = '<strong style="color:blue">弱</strong>';
    } else if (strength <= 2) {
      strength_str = '<strong style="color:blue">中等</strong>';
    } else {
      strength_str = '<strong style="color:green">强壮</strong>';
    }
    
    if(input_str.length < 6) {
      strength_str = '<strong style="color:orange">太弱</strong>';
    }

    output_display.innerHTML  = strength_str;
}
</script>
<div>
<span>密码强度: </span>
<span id="reg_passwd__strength_display__">
</span>
</div>
    </div>
    </form>
</body>
</html>

【责任编辑: lanier

昵 称:麦客网友[游客]  如果您不想匿名评论请先登录注册
评 论:请自觉遵守互联网相关政策法规,管理员有权删除恶意评论、广告和违禁词语。

验证码: 验证码,看不清楚?请点击刷新验证码    
麦客酷站赏析频道

精彩图文推荐

关于本站 - 联系站长 - 广告服务 - 合作伙伴 - 网站地图 - 版权声明 - 报告错误 - 收藏本站 | Http://www.MaiCoo.com

Copyright © 2005 - 2008 MaiCoo.com All Rights Reserved

违法和不良信息举报中心 本站服务器空间和带宽由雷克斯网络提供赞助
浙ICP备06017818号