ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript を使用して電子メール アドレスを検証するにはどうすればよいですか?

JavaScript を使用して電子メール アドレスを検証するにはどうすればよいですか?

Linda Hamilton
Linda Hamiltonオリジナル
2024-12-29 05:40:10294ブラウズ

How Can I Validate Email Addresses Using JavaScript?

JavaScript での電子メール アドレスの検証

ユーザー入力が有効な電子メール アドレスであることを確認するために、JavaScript にはいくつかの検証手法が用意されています。

レギュラー式:

正規表現の使用は、電子メール検証の効率的な方法です。有効な電子メール形式に一致する次の式を検討してください:

const validateEmail = (email) => {
  return String(email)
    .toLowerCase()
    .match(
      /^(([^<()[\]\.,;:\s@"]+(\.[^<()[\]\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
    );
};

Unicode サポート:

電子メール アドレスに Unicode 文字を含めるには、次の正規表現を使用します:

const re =
  /^(([^<()[\]\.,;:\s@"]+(\.[^<()[\]\.,;:\s@"]+)*)|(".+"))@(([^<()[\]\.,;:\s@"]+\.)+[^<()[\]\.,;:\s@"]{2,})$/i;

クライアント側検証:

この JavaScript コードは、クライアント側で電子メール アドレスを検証する方法を示します:

$('#email').on('input', validate);

function validate() {
  const email = $('#email').val();
  const $result = $('#result');
  $result.text('');

  if (validateEmail(email)) {
    $result.text(email + ' is valid.');
    $result.css('color', 'green');
  } else {
    $result.text(email + ' is invalid.');
    $result.css('color', 'red');
  }
  return false;
}

考慮事項:

次の点に注意してください。 JavaScript 検証だけでは十分ではなく、ユーザーが無効にできる可能性があります。データの整合性を確保するには、サーバー側でも検証を実装することが重要です。

以上がJavaScript を使用して電子メール アドレスを検証するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。