ホームページ > ウェブフロントエンド > jsチュートリアル > jsパスワード強度検証_javascriptスキル

jsパスワード強度検証_javascriptスキル

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
リリース: 2016-05-16 15:32:55
オリジナル
1223 人が閲覧しました

現在、多くのフォーラムやブログに、ユーザー登録時にパスワードの強度を検証する機能が追加されています。以前の記事で、パスワードの強度を検証する例を示しました。今日は、「js パスワード」の強度を検証します。 》コードを確認してください。

効果:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

<html>

<head>

<script language="javascript">

//CharMode函数

//测试某个字符是属于哪一类.

function CharMode(iN){

 if (iN>=48 && iN <=57) //数字

 return 1;

 if (iN>=65 && iN <=90) //大写字母

 return 2;

 if (iN>=97 && iN <=122) //小写

 return 4;

 else

 return 8; //特殊字符

}

//bitTotal函数

//计算出当前密码当中一共有多少种模式

function bitTotal(num){

 modes=0;

 for (i=0;i<4;i++){

 if (num & 1) modes++;

 num /= 2;

 }

 return modes;

}

//checkStrong函数

//返回密码的强度级别

function checkStrong(sPW){

 if (sPW.length<=4)

 return 0; //密码太短

 Modes=0;

 for (i=0;i<sPW.length;i++){

 //测试每一个字符的类别并统计一共有多少种模式.

 Modes|=CharMode(sPW.charCodeAt(i));

 }

 return bitTotal(Modes);

}

//pwStrength函数

//当用户放开键盘或密码输入框失去焦点时,根据不同的级别显示不同的颜色

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;

}

</script>

 

</head>

 

<body>

 

<form>

输入密码:<input type="password" size="10" onKeyUp="pwStrength(this.value)" onBlur="pwStrength(this.value)">

<br>密码强度:

 <table width="217" border="1" cellspacing="0" cellpadding="1" bordercolor="#cccccc" height="20">

 <tr align="center" bgcolor="#eeeeee">

 <td width="33%" id="strength_L">弱</td>

 <td width="33%" id="strength_M">中</td>

 <td width="33%" id="strength_H">强</td>

 </tr>

 </table>

</form>

 

</body>

</html>

ログイン後にコピー

上記は、あなたに共有された js パスワード強度検証のコードのすべてです。あなたの研究に役立つことを願っています。

関連ラベル:
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート