jQueryでメールアドレスのバリデートを行いたい

お疲れ様です。

表題の通りです。

以下のバリデートが機能していません。
正しい形式のメールアドレスを投げても、全て.matchの結果がnullで
コンソールに表示されてしまいます。

js
1        // メールアドレスが入力されていれば、バリデート
2        if ($('#mail-address').val() == '') {
3            displayErrorMessage('.error-mail-address', error_no_input)
4        } else {
5            if (validateMailAddress($('#mail-address').val()) == false) {
6                displayErrorMessage('.error-mail-address', error_mail_address)
7            }
8        }
9
10    // メールアドレスバリデーション
11    function validateMailAddress(value) {
12        /////// 確認用 /////////
13        console.log(value)
14        console.log(value.match('/^([a-zA-Z0-9])+([a-zA-Z0-9._-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9._-]+)+$/'));
15        /////// 確認用 /////////
16        if (value.match('/^([a-zA-Z0-9])+([a-zA-Z0-9._-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9._-]+)+$/')) {
17
18            return true;
19        }
20
21        return false;
22    };

どこに問題があるのでしょうか。。。。。

「a」「b」などの明らかにメールアドレスとしてありえない文字と、
個人のメールアドレスなどを試しましたが、全てnullで返ってきます。

コンソールでの確認は「確認用」というコメントアウトで挟まれている部分で行いました。。。。

m.ts10806

2021/02/08 00:29

これだけ提示されても他者は再現確認できません。呼び出し元とテストケースくらいは出しましょう

Chandler_Bing

2021/02/08 00:31

承知致致しました。

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

回答2件

メアドのバリデートはほとんど意味がないので最低限のもので十分です。

@が1個入っている
@の前に1文字以上の文字、@の後ろに「.」を1個以上含む文字

くらいが妥当でしょう

投稿2021/02/08 00:57

yambejp

総合スコア116724

ベストアンサー

value.match('/^([a-zA-Z0-9])+([a-zA-Z0-9._-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9._-]+)+$/')

この正規表現を言葉で説明すると、「文字列の先頭(^)の前にスラッシュがあり、…文字列の末尾($)の後にスラッシュがある」となります。

引用符を消して正規表現リテラルにするか、/ を消してください。

javascript
1value.match(/^([a-zA-Z0-9])+([a-zA-Z0-9._-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9._-]+)+$/)
2
3value.match('^([a-zA-Z0-9])+([a-zA-Z0-9._-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9._-]+)+$')

参考までに、#email-address が <input type=email> の場合、$('#email-address')[0].validity.typeMismatch でフォーマットのチェックが可能で、$('#email-address')[0].validationMessage でブラウザが用意したエラーメッセージが取得可能です(Chrome だとかなり細かい)。

投稿2021/02/08 00:47

編集2021/02/08 00:55