javascriptパスワードの妥当性チェック

パスワードの妥当性チェックをjavascriptにて作成しています。
パスワードを入力するフォームとそれを確認する二つのフォームをつくりました。
最初のフォームでは、パスワードが6~20文字の半角英数字のみで入力されているか
判定するJSを作成し、うまく動かすことができました。
しかし、2つ目の確認フォームで、つまづきました。
最初に入力されたパスワードと等しければ、確認としてコンソール上に「問題なし」と
表示されるはずが、エラーメッセージ表示されてしまいます。
エラーメッセージは下記のようなものです↓
SCRIPT12030: SCRIPT12030: WebSocket Error: Network Error 12030, サーバーへの接続は異常に終了しました
「以上、エラーメッセージ終わり」

どなたかご教示いただけませんでしょうか？

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1.0">
6    <title>パスワードの妥当性チェック</title>
7    <link rel="stylesheet" href="style.css">
8</head>
9<body>
10    <form action="#">
11        <ul class="form">
12            <li class="item">パスワード<input type="text" id="password"><span id="errorPassword"></span></li>
13            <li class="item">パスワード(確認)<input type="text" id="passwordConfirm"><span id="errorConfirmPassword"></span></li>
14        </ul>
15            
16    </form>  
17    <script>
18        var errorPass = document.getElementById('errorPassword');
19        var errorPassMessage = 'パスワードは6~20文字以内で、半角英数字のみで入力してください。';        
20
21        document.getElementById('password').onblur = function(){
22            errorPass.innerHTML = '';
23            if(password.length < 6 && password.length >20){
24                errorPass.innerText = errorPassMessage;
25            } else if(!this.value.match(/[a-z][0-9]/)){
26                errorPass.innerText = errorPassMessage;
27            } else{
28                console.log('問題なし');
29            }
30        }
31        
32        var errorConfirmPass = document.getElementById('errorConfirmPassword');
33        var errorConfirmPassMessage = '入力されたパスワードと正しくありません。もう一度入力し直してください。';
34
35        document.getElementById('passwordConfirm').onblur = function(){
36            errorConfirmPass.innerHTML = '';
37            if(password !== passwordConfirm){
38                errorConfirmPass.innerText = errorConfirmPassMessage;
39            } else {
40                console.log('パスワード確認、問題なし');
41            }
42        }
43
44    </script>  
45</body>
46</html>

maisumakun

2020/05/28 01:09

「うまくできない」とは、「どうなるはず」のものが「どのように動作している」状況でしょうか。

kei344

2020/05/28 01:11

「うまくできない」とは「何をしたときに」「どうなると思って」「どうなったのか」を、出ているエラーなどと併せて、具体的に記述されたほうが回答を得られやすいと思います。

takochan1192

2020/05/28 01:26

maisumakun様 kei344様大変失礼いたしました。パスワードを入力するフォームを2つつくり、一つ目は、パスワードが6~20文字で半角英数字のみで入力されているか、判定するJSを作成し、うまくいきました。2つ目につくったパスワードを確認するフォームで、最初に入力されたパスワードと等しければ、エラーメッセージが出ず、確認としてコンソール上に、「問題なし」と表示されるはずが、エラーメッセージが表示されてしまいます。

kei344

2020/05/28 01:27

この「質問への追記・修正の依頼」の部分はデフォルトで表示されませんので、質問本文に追記することをお勧めします。

takochan1192

2020/05/28 01:28

確認用パスワードとして入力したものを、最初に入力したパスワードと正しいかどうか判定したいのですが、うまくいきませんでした。エラーメッセージは下記のようなものが出ております。 SCRIPT12030: SCRIPT12030: WebSocket Error: Network Error 12030, サーバーへの接続は異常に終了しました言葉足らずで大変恐縮なのですが、ご教示の程、何卒よろしくお願い申し上げます。

takochan1192

2020/05/28 01:35

kei344様ご指摘ありがとうございます。早速、質問本文の追記をさせていただきました。