.matchメソッドが効かないです

前提・実現したいこと

javascriptでユーザー登録機能を作っています。
送信前に入力データチェックをして、正しく入力されていないと送信を止めるようにしたいです。
正規表現で.match()メソッドを使って入力チェックをしたいのですが、上手く使えません
親切な方教えて頂けませんか？

発生している問題・エラーメッセージ

Uncaught TypeError: Cannot read property 'match' of undefined
    at HTMLInputElement.nameCheck

該当のソースコード

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <article>
        <p id="add-user">ユーザー登録</p>
        <form method="get" id="user-text" onsubmit="return Check();">
            <input type="text" id="name" placeholder="ユーザー名">
            <p id="name_p"></p>
            <input type="text" id="mail" placeholder="メールアドレス">
            <p id="mail_p"></p>
            <input type="text" id="pass" placeholder="パスワード">
            <p id="pass_p"></p>
            <input type="text" id="pass2" placeholder="パスワード(確認)">
            <p id="pass2_p"></p>
            <input id="button" type="submit" value="ユーザー登録">
        </form>
</article>
<script>
    let nameFlag = false;
    let mailFlag = false;
    let passFlag = false;
    let pass2Flag = false;
 function nameCheck(){
     let name = document.getElementById('name').Value;
     let nameP = document.getElementById('name_p');
     let regName = /^[^a-zA-Z0-9]/g;
     let nameResult = name.match(regName);
     if(name === ''){
         nameP.innerHTML='名前を入力して下さい';
     }else if(name <= 8){
         nameP.innerHTML = '8文字以内で入力して下さい';
     }else if(nameResult === null){
         nameP.innerHTML = '英数字以外で入力して下さい';
     }else{
         nameP.innerHTML = '入力完了';
         nameFlag = true;
     }
 }
 function mailCheck(){
     let mail = document.getElementById('mail').value;
     let mailP = document.getElementById('mail_p');
     let regMail = /^[]$/g;
     let mailResult = mail.match(regMail);
     if(mail === ''){
         mailP.innerHTML='メールアドレスを入力して下さい';
     }else if(mailResult === null){
         mailP.innerHTML= '不正なメールアドレスです';
     }else{
         mailP.innerHTML = '入力完了';
         mailFlag = true;
     }
 }
 let pass = document.getElementById('pass').value;
 function passCheck(){
     let passP = document.getElementById('pass_p');
     let regPass = /^([a-zA-Z0-9]{10,18})$/;
     let passResult = pass.match(regPass);
     if(pass === ''){
         passP.innerHTML='パスワードを入力して下さい';
     }else if(passResult === null){
         passP.innerHTML='半角英数字10-18文字で入力して下さい';
     }else{
         passP.innerHTML = '入力完了';
         passFlag = true;
     }
 }
 function pass2Check(){
    let pass2 = document.getElementById('pass2').value;
     let pass2P = document.getElementById('pass2_p');
     if(pass2 !== pass){
        pass2P.innerHTML='パスワードをもう一度入力して下さい';
     }else{
         pass2P = '入力完了';
         pass2Flag = true;
     }
 }
 let button = document.getElementById('button');
    button.addEventListener('click',nameCheck,false);
    button.addEventListener('click',mailCheck,false);
    button.addEventListener('click',passCheck,false);
    button.addEventListener('click',pass2Check,false);
if(nameFlag===true && mailFlag===true && passFlag===true && pass2Flag===true){
    function Check(){
        return true;
    }
}else{
    function Check(){
        return false;
    }
}
</script>
</body>
</html>

試したこと

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

行動規範の内容に同意します

回答1件

ベストアンサー

javascript
1 function nameCheck(){
2     let name = document.getElementById('name').Value;

Value という存在しないプロパティを参照しているため、name が undefined になってます。value (先頭が小文字)プロパティをアクセスしてください。

ここ以外にもぱっと見ておかしなところが何箇所かありますが、それらはまた別の問題なので別の質問を立ててください。

投稿2021/02/08 13:53

編集2021/02/08 14:06

int32_t

総合スコア20845

nekoma3

2021/02/08 15:08

できました！ありがとうございます！

行動規範の内容に同意します

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう！