`

一个简单的鉴别密码强度的jquery tip

阅读更多

$('#pass').keyup(function(e) {
     var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g");
     var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g");
     var enoughRegex = new RegExp("(?=.{6,}).*", "g");
     if (false == enoughRegex.test($(this).val())) {
             $('#passstrength').html('More Characters');
     } else if (strongRegex.test($(this).val())) {
             $('#passstrength').className = 'ok';
             $('#passstrength').html('Strong!');
     } else if (mediumRegex.test($(this).val())) {
             $('#passstrength').className = 'alert';
             $('#passstrength').html('Medium!');
     } else {
             $('#passstrength').className = 'error';
             $('#passstrength').html('Weak!');
     }
     return true;
});


<form namRune="Login" method="post" action="">
    <fieldset>
        <legend>Password Strength</legend>        
        <input type="password" name="pass" id="pass">
        <span id="passstrength"></span>
    </fieldset>
</form>                


 
body { font: 12px/1.5 Verdana, Geneva, sans-serif; }
legend { padding: 5px 0;  } 
input { padding: 2px; }


 
分享到:
评论

相关推荐

    jquery.validate表单验证密码完整例子(带密码强度显示)

    在本文中,我们将深入探讨`jQuery Validate`插件的一个实用示例,该示例涉及到密码验证,同时还提供了密码强度的实时显示。`jQuery Validate`是一个非常流行且功能强大的JavaScript库,用于验证HTML表单中的输入数据...

    jquery密码强度效果

    总的来说,"jquery密码强度效果"是一个实用的Web开发示例,它展示了如何结合jQuery和正则表达式来增强用户界面,提高密码安全性。这个项目对于学习JavaScript和前端开发的人员来说,是一个很好的实践案例,可以加深...

    jquery密码强度验证

    例如,一个简单的6位密码验证规则可能只允许数字和小写字母的组合,而8位密码可能需要包含大写字母和数字。 ```javascript // 假设我们有一个输入框用于输入密码 // jQuery代码 $(document).ready(function() { ...

    jQuery密码强度检测.rar

    jQuery密码强度检测.rar jQuery密码强度检测.rar jQuery密码强度检测.rar jQuery密码强度检测.rar jQuery密码强度检测.rar jQuery密码强度检测.rar jQuery密码强度检测.rar jQuery密码强度检测.rar jQuery密码强度...

    Jquery Tip 插件使用

    content: '这是一个提示信息', position: 'top', trigger: 'hover', delay: 500 }); ``` ### 4. 自定义样式 默认的CSS样式可能无法满足所有设计需求,开发者可以通过修改`jquery.tip.css`或在项目中创建新的...

    jquery密码强度检测_密码强度验证_密码强度正则表达式代码_动画效果

    在开发Web应用时,用户账户的安全性至关...总结来说,通过jQuery结合正则表达式,我们可以实现一个实时的密码强度检测功能,同时使用图像和动画提供直观的反馈。这不仅提升了用户体验,也为网站的安全性提供了保障。

    jQuery密码强度检测代码

    本篇文章将深入探讨如何利用jQuery实现一个密码强度检测的代码。 首先,我们需要理解密码强度的基本要求。通常,一个强密码应该包含以下几点: 1. 长度:至少8个字符,更长则更好。 2. 复杂性:包含大写字母、小写...

    jquery验证密码强度

    例如,一个简单的密码强度检查可能包括以下规则: 1. 密码长度至少为8个字符。 2. 包含至少一个大写字母。 3. 包含至少一个小写字母。 4. 包含至少一个数字。 5. 可选地,包含至少一个特殊字符(如@、#、$等)。 ...

    jquery title提示效果,jquery tip提示效果

    6. **插件使用**:`jquery.tip.js`可能是一个预封装的jQuery插件,用于方便地实现提示效果。使用时,需要先引入jQuery库,然后引入插件,最后调用相应的插件方法,如`$('selector').tip(options)`。 7. **示例代码*...

    jQuery输入密码强度验证代码

    在这个场景中,我们利用`jQuery`来实现一个密码强度验证功能,帮助用户创建更安全的密码。 标题中的“jQuery输入密码强度验证代码”指的是利用`jQuery`来编写一段脚本,实时监测用户在密码输入框中输入的内容,并...

    jquery.tip 点击加分效果,漂亮的tip

    在本文中,我们将深入探讨jQuery库中的一个独特插件——jQuery.tip。这个插件主要用于创建具有点击加分效果的提示信息,通常称为“提示框”或“提示气泡”。这种效果可以增强用户界面的互动性和用户体验,使信息传递...

    jquery 密码强度检测

    总的来说,jQuery密码强度检测是一个实用的功能,通过结合JavaScript和jQuery的事件处理、DOM操作,以及可能的Java组件,可以创建出既直观又安全的密码输入体验。开发者可以根据项目需求灵活选择实现方式,确保用户...

    密码强度检测(jquery).rar

    标题中的“密码强度检测(jquery).rar”表明这是一个基于jQuery的密码强度检测工具的压缩包文件。在网页开发中,密码强度检测是确保用户创建安全密码的重要环节,它可以指导用户创建复杂度足够、不易被猜解的密码,...

    漂亮易用的jQuery密码强度验证插件

    一个漂亮易用的jQuery密码强度验证插件,随着密码强度的改变而改变密码输入的颜色

    jquery 检测密码强度插件

    本篇文章将深入探讨一个重要的jQuery插件——用于检测密码强度的插件,这对于创建安全的Web应用至关重要。随着网络安全的日益重要,用户密码的强度成为了一道防线,有效的密码强度检测能帮助用户创建更难破解的密码...

    很特别的jquery验证密码强度

    这个名叫 Naked Password 的 jQuery 插件可以帮忙检测密码强度。用上它以后在设置密码时,输入框里的小人(她的名字叫Sally)会随着你输入密码的强度把衣服一件件脱去,到她一丝不挂时就说明密码够强啦!

    jquery密码强度检测_密码强度验证_密码强度正则表达式代码

    jQuery是一款广泛使用的JavaScript库,它提供了丰富的功能和简洁的API,使得在前端实现密码强度检测变得简单易行。本篇文章将深入探讨如何利用jQuery进行密码强度检测,以及密码强度验证的正则表达式代码实现。 ...

    基于jquery的密码强度的验证

    总的来说,这个基于jQuery的密码强度验证方案提供了一种方便、直观的方式来增强网站的安全性,帮助用户创建更强大的密码,同时也为开发者提供了一个易于集成和定制的工具。在实际开发中,可以根据需求调整验证规则,...

Global site tag (gtag.js) - Google Analytics