联系表格自定义电子邮件字段验证

Question

我有一个简单的问题，但我不知道如何解决。

这是一个验证联系表单的简单 js。

$(document).ready(function(){
  $('#sendMessage').on('click',function(data){
    data.preventDefault();

    var flname = $('#name').val();
    var emailadd = $("#email").val();
    var mess = $('#message').val();

    if(flname.length == 0){
      $('.formMessage').text('Error message');
      return false;
    }
    else if(emailadd.length == 0){
      $('.formMessage').text('Error message');
      return false;
    }
    else if(){
      $('.formMessage').text('Please insert valid email address');
      return false;
    }
    else if(mess.length == 0){
      $('.formMessage').text('Error message');
      return false;
    }
      $('.formMessage').text('Message sent');
  });
});

有一个部分带有错误消息 "Please insert valid email address"。我不知道如何执行检查以查看用户是否写了任何东西，如果他写了我如何检查是否输入了电子邮件地址（例如有 @ 和 .）。

我禁用了默认操作，我想在上面写的js里面写那个电子邮件检查。

Answer 1

添加此功能以检查电子邮件有效性

$(document).ready(function(){
  $('#sendMessage').on('click',function(data){
    data.preventDefault();

    var flname = $('#name').val();
    var emailadd = $("#email").val();
    var mess = $('#message').val();

    if(flname.length == 0){
      $('.formMessage').text('Error message');
      return false;
    }
    else if(emailadd.length == 0){
      $('.formMessage').text('Error message');
      return false;
    }
    else if (!ValidateEmail(emailadd)) {
      $('.formMessage').text('Please insert valid email address');
      return false;
    }
    else if(mess.length == 0){
      $('.formMessage').text('Error message');
      return false;
    }
      $('.formMessage').text('Message sent');
  });
});



function ValidateEmail(email) {
    var expr = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
    return expr.test(email);
};

Answer 2

$(document).ready(function(){
  $('#sendMessage').on('click',function(data){
    data.preventDefault();

    var flname = $('#name').val();
    var emailadd = $("#email").val();
    var mess = $('#message').val();

    var x = document.forms["myForm"]["email"].value;
    var atpos = x.indexOf("@");
    var dotpos = x.lastIndexOf(".");


    if(flname.length == 0){
      $('.formMessage').text('Error message');
      return false;
    }
    else if(emailadd.length == 0){
      $('.formMessage').text('Error message');
      return false;
    }
    else if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length) {
      $('.formMessage').text('Please insert valid email address');
      return false;
    }
    else if(mess.length == 0){
      $('.formMessage').text('Error message');
      return false;
    }
      $('.formMessage').text('Message sent');
  });
});

请输入表格名称= "myForm"

这个简单的 JavaScript 电子邮件验证 -- 参考 (https://www.w3schools.com/js/tryit.asp?filename=tryjs_form_validate_email)

您也可以使用正则表达式。

联系表格自定义电子邮件字段验证

contact form custom email field validation

javascript

jquery

email-validation