JS實現(xiàn)根據(jù)密碼長度顯示安全條功能
更新時間:2017年03月08日 14:56:57 作者:yanfangphp
這篇文章主要介紹了基于JS實現(xiàn)根據(jù)密碼長度顯示安全條功能,非常不錯,在一些網(wǎng)站上經(jīng)常會遇到此功能,需要的的朋友參考下實現(xiàn)代碼吧
大家在一些網(wǎng)站上經(jīng)??梢钥吹綌?shù)碼密碼會根據(jù)輸入的密碼長度顯示安全條功能,此功能基于js如何實現(xiàn)的呢?下面看下實現(xiàn)代碼,具體代碼如下所示:
//根據(jù)密碼長度顯示安全條
<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">使用數(shù)字,字母,下劃線,長度在 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實現(xiàn)根據(jù)密碼長度 顯示安全條功能,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關文章
javascript實現(xiàn)數(shù)據(jù)雙向綁定的三種方式小結
本篇文章主要介紹了javascript實現(xiàn)數(shù)據(jù)雙向綁定的三種方式小結,前端的視圖層和數(shù)據(jù)層有時需要實現(xiàn)雙向綁定,目前實現(xiàn)數(shù)據(jù)雙向綁定主要有三種,有興趣的可以了解一下。2017-03-03
淺談SpringMVC中post checkbox 多選框value的值(隱藏域方式)
下面小編就為大家分享一篇淺談SpringMVC中post checkbox 多選框value的值(隱藏域方式),具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-01-01
如何在CocosCreator中使用http和WebSocket
這篇文章主要介紹了在Cocos Creator中使用的Http和WebSocket,對websocket感興趣的同學,一定要看下2021-04-04

