有我的版本的电子邮件验证器. 这个代码是用对象导向的编程进行的,并作为一个类的静态方法实现。 你会发现两个版本的验证器:严格(EmailValidator.validate)和类型(EmailValidator.validateKind)。

第一個扔一個錯誤,如果一個電子郵件是無效的,並返回電子郵件不同. 第二個返回 Boolean 值,說一個電子郵件是有效的。

export class EmailValidator {
    /**
     * @param {string} email
     * @return {string}
     * @throws {Error}
     */
    static validate(email) {
        email = this.prepareEmail(email);

        const isValid = this.validateKind(email);

        if (isValid)
            return email;

        throw new Error(`Got invalid email: ${email}.`);
    }

    /**
     * @param {string} email
     * @return {boolean}
     */
    static validateKind(email) {
        email = this.prepareEmail(email);

        const regex = this.getRegex();

        return regex.test(email);
    }

    /**
     * @return {RegExp}
     * @private
     */
    static getRegex() {
        return /^(([^<>()\[\]\\.,;:\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,}))$/;
    }

    /**
     * @param {string} email
     * @return {string}
     * @private
     */
    static prepareEmail(email) {
        return String(email).toLowerCase();
    }
}

要验证电子邮件,您可以遵循以下方式:

// First way.

try {
    EmailValidator.validate('balovbohdan@gmail.com');
} catch (e) {
    console.error(e.message);
}

// Second way.

const email = 'balovbohdan@gmail.com';
const isValid = EmailValidator.validateKind(email);

if (isValid)
    console.log(`Email is valid: ${email}.`);
else
    console.log(`Email is invalid: ${email}.`);

在现代浏览器中,您可以使用纯粹的JavaScript和DOM创建 @Sushil的答案:

function validateEmail(value) {
  var input = document.createElement('input');

  input.type = 'email';
  input.required = true;
  input.value = value;

  return typeof input.checkValidity === 'function' ? input.checkValidity() : /\S+@\S+\.\S+/.test(value);
}

我把一个例子聚集在一个字符串 http://jsfiddle.net/boldewyn/2b6d5/. 结合功能检测和Squirtle的答案的字符串验证,它释放了你从常规的表达屠杀,并不会在旧的浏览器上跳舞。

我正在寻找一个 Regex 在 JS 通过所有电子邮件地址测试案例:

email@example.com 有效电子邮件 firstname.lastname@example.com 电子邮件包含地址字段 email@subdomain.example.com 电子邮件包含字段与域名 firstname+lastname@example.com Plus 标志被认为是有效的字符 email@192.0.2.123 域名是有效的 IP 地址 email@[192.0.2.123] IP 地址周围的广场 被认为是有效的“email”@example.com 电子邮件周围的引用是 c

这里我们去:

HTTP://regexr.com/3f07j

或雷格斯:

Regex = /(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@[*[a-zA-Z0-9-]+.[a-zA-Z0-9-.]+]*/

如果你正在使用NG模式和材料,这就是工作。

vm.validateEmail = '([a-zA-Z0-9_.]{1,})((@[a-zA-Z]{2,})[\\\.]([a-zA-Z]{2}|[a-zA-Z]{3}))';

好吧,有很多答案包含一些不同的常规表达式,我尝试了很多,我得到了不同的结果和各种不同的问题。

对于 UI 验证,我对寻找 @ 标志的最基本检查很好,重要的是要注意的是,我总是用标准的“验证电子邮件”进行服务器侧验证,其中包含用户确认他们的电子邮件地址的独特链接。

if (email.indexOf('@') > 0)

我故意选择了0甚至以零为基础,因为它也确保在 @ 之前有一个单个字符。

下面是一个解决方案,它工作,并包括验证 / 通知的幻觉性,以以下形式:

您可以在此链接上运行

雅加达

(function() {
  'use strict';

  window.addEventListener('load', function() {
    var form = document.getElementById('needs-validation');
    form.addEventListener('submit', function(event) {
      if (form.checkValidity() === false) {
        event.preventDefault();
      }
      form.classList.add('was-validated');
      event.preventDefault();              
    }, false);
  }, false);
})();

HTML

<p class='title'>
    <b>Email validation</b>
  <hr size="30px;">
</p>
<br>

<form id="needs-validation" novalidate>
  <p class='form_text'>Try it out!</p>
  <div class="form-row">
    <div class="col-12">
      <input type="email" class="form-control" placeholder="Email Address" required>
        <div class="invalid-feedback">
          Please enter a valid email address.
        </div>
    </div>
  <div class="row">
    <div class="col-12">
      <button type="submit" 
          class="btn btn-default btn-block">Sign up now
      </button>
    </div>
   </div>
</form>