Javascript 电子邮件验证和号码长度不起作用

我有两个文本字段，我想在注册前检查一下号码和电子邮件是否有效。电子邮件的格式必须正确，数字必须精确到11位。未能匹配其中一个将显示错误消息

在电子邮件中，我尝试了验证电子邮件功能，所需的格式和符号都在变量中。至于我试过的数字“c.length！==11”

每当我试图点击注册按钮时，没有任何变化

JAVASCRIPT:

function validateEmail(v_email) {
  var re = /^(([^<>()[\]\\.,;:\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,}))$/;
  return re.test(v_email);
}

document.getElementById("register").onclick = function () {

var contact = document.getElementById("contact").value;
var email = document.getElementById("email").value;


  let c = contact.val() + ''; // make sure it's a string
  c = c.trim()// trim it
  if (c.length !== 11) {
      document.getElementById("number_label").innerHTML = "<span style='color: red;'>Invalid contact number (must contain 11 digits)</span>";
  } else {
      document.getElementById("number_label").innerHTML = "Contact Number";
  }


  if (validateEmail(v_email)) {
    document.getElementById("email_label").innerHTML = "Email";
  } else {
    document.getElementById("email_label").innerHTML = "<span style='color: red;'>Invalid email address</span>";
  }


return false;
}

功能验证电子邮件（v_电子邮件）{
变量re=/^（[^（）[\]\\，；：\s@\“]+（\.[^（）[\]\，；：\s@\“]+）*）（\'+\”）（\[[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[1,3}.[0-9]{1,3}.]；
返回重新测试（v_电子邮件）；
}
document.getElementById（“寄存器”）.onclick=function（）{
var contact=document.getElementById（“contact”）.value；
var email=document.getElementById（“email”）.value；
让c=contact.val（）+“”；//确保它是字符串
c=c.trim（）//修剪它
如果（c.长度！==11）{
document.getElementById（“数字标签”）.innerHTML=“无效的联系人号码（必须包含11位数字）”；
}否则{
document.getElementById（“数字标签”）.innerHTML=“联系人号码”；
}
如果（验证电子邮件（v_电子邮件））{
document.getElementById（“电子邮件标签”）.innerHTML=“电子邮件”；
}否则{
document.getElementById（“电子邮件标签”）.innerHTML=“无效电子邮件地址”；
}
返回false；
}

HTML:

联系电话
您有很多小错误，但是下面的代码应该可以正常工作（没有测试它）

变化：

contact
变量没有
val
函数，因为它是一个字符串（或int），
contact
变量已经保存了输入值
validateEmail
获取了错误的参数，您复制了函数声明，但忘记将传递的变量更改为
email
添加了
flag
var，这样您就可以知道是否发生了错误，当出现错误时，我们的标志将为真，因此稍后我们会检查-如果标志为真，我们有一个错误，因此不要继续，只需
返回false

现在应该可以工作了

function validateEmail(v_email) {
  var re = /^(([^<>()[\]\\.,;:\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,}))$/;
  return re.test(v_email);
}

document.getElementById("register").onclick = function () {

var contact = document.getElementById("contact").value;
var email = document.getElementById("email").value;
var flag = false;

  let c = contact + ''; // make sure it's a string
  c = c.trim()// trim it
  if (c.length !== 11) {
      document.getElementById("number_label").innerHTML = "<span style='color: red;'>Invalid contact number (must contain 11 digits)</span>";
flag = true;
  } else {
      document.getElementById("number_label").innerHTML = "Contact Number";
  }

  if (validateEmail(email)) {
    document.getElementById("email_label").innerHTML = "Email";
  } else {
    document.getElementById("email_label").innerHTML = "<span style='color: red;'>Invalid email address</span>";
flag = true;
  }

if(flag) {
  return false;
} 
}

功能验证电子邮件（v_电子邮件）{
变量re=/^（[^（）[\]\\，；：\s@\“]+（\.[^（）[\]\，；：\s@\“]+）*）（\'+\”）（\[[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[1,3}.[0-9]{1,3}.]；
返回重新测试（v_电子邮件）；
}
document.getElementById（“寄存器”）.onclick=function（）{
var contact=document.getElementById（“contact”）.value；
var email=document.getElementById（“email”）.value；
var标志=假；
让c=contact+''；//确保它是字符串
c=c.trim（）//修剪它
如果（c.长度！==11）{
document.getElementById（“数字标签”）.innerHTML=“无效的联系人号码（必须包含11位数字）”；
flag=true；
}否则{
document.getElementById（“数字标签”）.innerHTML=“联系人号码”；
}
如果（验证邮件（电子邮件））{
document.getElementById（“电子邮件标签”）.innerHTML=“电子邮件”；
}否则{
document.getElementById（“电子邮件标签”）.innerHTML=“无效电子邮件地址”；
flag=true；
}
国际单项体育联合会（旗）{
返回false；
} 
}

注意：
关于contact变量，您只需检查其长度是否为11，这意味着“Im just tst”将通过测试。
表单中的第一条规则是，您不能信任用户的任何输入，并且必须检查服务器上的输入

最好的方法是在Javascript中进行“浅层”测试，以确保所有明显的内容都被检查，然后对后端（PHP代码）中的输入进行认真检查。
您有很多小错误，但下面的代码应该按预期工作（没有测试它）

变化：

contact
变量没有
val
函数，因为它是一个字符串（或int），
contact
变量已经保存了输入值
validateEmail
获取了错误的参数，您复制了函数声明，但忘记将传递的变量更改为
email
添加了
flag
var，这样您就可以知道是否发生了错误，当出现错误时，我们的标志将为真，因此稍后我们会检查-如果标志为真，我们有一个错误，因此不要继续，只需
返回false

现在应该可以工作了

function validateEmail(v_email) {
  var re = /^(([^<>()[\]\\.,;:\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,}))$/;
  return re.test(v_email);
}

document.getElementById("register").onclick = function () {

var contact = document.getElementById("contact").value;
var email = document.getElementById("email").value;
var flag = false;

  let c = contact + ''; // make sure it's a string
  c = c.trim()// trim it
  if (c.length !== 11) {
      document.getElementById("number_label").innerHTML = "<span style='color: red;'>Invalid contact number (must contain 11 digits)</span>";
flag = true;
  } else {
      document.getElementById("number_label").innerHTML = "Contact Number";
  }

  if (validateEmail(email)) {
    document.getElementById("email_label").innerHTML = "Email";
  } else {
    document.getElementById("email_label").innerHTML = "<span style='color: red;'>Invalid email address</span>";
flag = true;
  }

if(flag) {
  return false;
} 
}

功能验证电子邮件（v_电子邮件）{
变量re=/^（[^（）[\]\\，；：\s@\“]+（\.[^（）[\]\，；：\s@\“]+）*）（\'+\”）（\[[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[1,3}.[0-9]{1,3}.]；
返回重新测试（v_电子邮件）；
}
document.getElementById（“寄存器”）.onclick=function（）{
var contact=document.getElementById（“contact”）.value；
var email=document.getElementById（“email”）.value；
var标志=假；
让c=contact+''；//确保它是字符串
c=c.trim（）//修剪它
如果（c.长度！==11）{
document.getElementById（“数字标签”）.innerHTML=“无效的联系人号码（必须包含11位数字）”；
flag=true；
}否则{
document.getElementById（“数字标签”）.innerHTML=“联系人号码”；
}
如果（验证邮件（电子邮件））{
document.getElementById（“电子邮件标签”）.innerHTML=“电子邮件”；
}否则{
document.getElementById（“电子邮件标签”）.innerHTML=“无效电子邮件地址”；
flag=true；
}
国际单项体育联合会（旗）{
返回false；
} 
}

注意：
关于contact变量，您只需检查其长度是否为11，这意味着“Im just tst”将通过测试。
表单中的第一条规则是，您不能信任用户的任何输入，并且必须检查服务器上的输入

最好的方法是用Javascript进行“浅层”测试，确保所有明显的东西都被检查过，然后认真检查后端（PHP代码）中的输入。
您不需要使用Javascript验证电子邮件或将
#contact
输入限制为
11
。只需使用属性即可验证电子邮件输入<
<input type="text" maxlength="11" id="contact" name="contact" required>
<input type="email" id="email" name="email" required>