原文:http://www.open-open.com/code/view/1431324883763

//根据密码长度显示安全条

                    <ul class="clear">
<li>密  码:</li>
<li> <input type="password" id="pwd" name="pwd" class="in" onKeyUp=pwStrength(this.value) onBlur=pw_y("pwd","pwd1")></li>
<li><em class="red">*</em></li>
<li class="i2 grey"><table border="0" bordercolor="#cccccc" style='display:marker'>
<tr align="center">
<td id="strength_L" bgcolor="#eeeeee">弱</td>
<td id="strength_M" bgcolor="#eeeeee">中</td>
<td id="strength_H" bgcolor="#eeeeee">强</td>
<td align="left" >
<label id="pwd1">使用数字,字母,下划线,长度在 6 - 20 个字符之间</label></td>
</tr>
</table>
</li>
</ul> function pwStrength(pwd){
O_color="#eeeeee";
L_color="#FF0000";
M_color="#FF9900";
H_color="#33CC00";
if (pwd==null||pwd==''){
Lcolor=Mcolor=Hcolor=O_color;
}else{
S_level=checkStrong(pwd);
switch(S_level) {
case 0:
Lcolor=Mcolor=Hcolor=O_color;
case 1:
Lcolor=L_color;
Mcolor=Hcolor=O_color;
break;
case 2:
Lcolor=Mcolor=M_color;
Hcolor=O_color;
break;
default:
Lcolor=Mcolor=Hcolor=H_color;
}
}
document.getElementById("strength_L").style.background=Lcolor;
document.getElementById("strength_M").style.background=Mcolor;
document.getElementById("strength_H").style.background=Hcolor;
return;
}

JS实现根据密码长度 显示安全条的更多相关文章

  1. js正则表达式,密码长度要大于6位,由数字和字母组成

    var pwd = $("#pwd").val(); var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,}$/; if(!reg ...

  2. js 文件异步上传 显示进度条 显示上传速度 预览文件

    通常文件异步提交有几个关键 1.支持拖拽放入文件.2.限制文件格式.3.预览图片文件.4.上传进度,速度等,上传途中取消上传.5.数据与文件同时上传 现在开始笔记: 需要一个最基础的元素<inp ...

  3. HTML+JS实现视频上传显示进度条

    示例代码: css部分: #content{border: 1px solid saddlebrown;padding: 16px;border-radius: 2px} .list {top: 15 ...

  4. JS实现数组每次只显示5条数据

    var array = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16]; //循环样式结构function fun(arr,index){ var str = &qu ...

  5. js控制密码的显示与隐藏实例

    原理是建立2个input,一个type是text,一个type是password.在点击按钮时,这两input个的显示状态与val()的值在切换. html: <!DOCTYPE html> ...

  6. JS原生上传大文件显示进度条-php上传文件

    JS原生上传大文件显示进度条-php上传文件 在php.ini修改需要的大小: upload_max_filesize = 8M    post_max_size = 10M    memory_li ...

  7. JS实现登录页密码的显示和隐藏功能

    在登录页经常会用到通过点击文本框的类似小眼睛图片来实现隐藏显示密码的功能,其实实现原理很简单,通过点击事件来改变input的type类型,具体过程看代码: 在没给大家分享实现代码之前,先给大家展示下效 ...

  8. Asp.Net实现无刷新文件上传并显示进度条(非服务器控件实现)(转)

    Asp.Net实现无刷新文件上传并显示进度条(非服务器控件实现) 相信通过Asp.Net的服务器控件上传文件在简单不过了,通过AjaxToolkit控件实现上传进度也不是什么难事,为什么还要自己辛辛苦 ...

  9. JQuery完整验证&密码的显示与隐藏&验证码

    HTML <link href="bootstrap.css" rel="stylesheet"> <link href="gloa ...

随机推荐

  1. 简单css动画 fadeIn fadeOut flash

    考虑兼容性采用 -webkit- -o- -mos- -ms- @keyframes fadeIn{ 0%{ opacity: 0; display: block; } 100%{ opacity: ...

  2. classList属性和className的区别

    className的不方便之处: 在操作类名时,需要通过className属性添加,删除和替换类名.因为className中是一个字符串,所以即使只修改字符串一部分,也必须每次都设置整个字符串的值.( ...

  3. Linux基础学习-数据备份工具Rsync

    数据备份工具rsync 作为一个系统管理员,数据备份是非常重要的,如果没有做好备份策略,磁盘损坏了,那么你的数据将全部丢失,所以在日常的维护工作中,一定要时刻牢记给数据做备份. rsync不仅可以可以 ...

  4. linux设备驱动程序 - 待解决问题记录

    1.每个模式都有自己的内存映射,也即自己的地址空间?(P26) http://www.cnblogs.com/wuchanming/p/4360277.html (不知道是不是,没时间看)

  5. GIMP如何创建layer masks,创建,删除,禁用,复制mask

    这次案例是背景替换,采用创建一个新的layer masks: 前期准备好要处理的图片:     1.创建一个新的图层,选择Layer,点击Mask,选择Add Layer Mask: 根据情况选择合适 ...

  6. Makefile文件中的sed介绍

    haoxin$ sed --helpUsage: sed [OPTION]... {script-only-if-no-other-script} [input-file]... -n, --quie ...

  7. 对linux中source,fork,exec的理解以及case的 使用

    fork   使用 fork 方式运行 script 时, 就是让 shell(parent process) 产生一个 child process 去执行该 script, 当 child proc ...

  8. JS(DOM 和 BOM)

    JS(DOM 和 BOM) 常说的JS(浏览器执行的JS)包含两部分:1.JS基础知识(语法)(ECMA262标准)2.JS-Web-API(W3C标准) W3C 标准中关于 JS 的规定有:(只管定 ...

  9. thymeleaf和artTemplate

    Company最近项目中使用了两个模板引擎,分别是Java服务器端的模板引擎Thymeleaf和前端的模板引擎artTemplate, 其实对于这两个模板引擎 理论上应该是不应该放在一起记录的,但是b ...

  10. 【11】把 GitHub 当 CMS 用

    把 GitHub 当 CMS 用 你的网站需要显示一些文字,但是你还不想直接放在 HTML 里面,那你可以把 GitHub 作为你储存内容的一个地方. 这样,就可以让任何一个非程序员通过修改 Mark ...