Javascript - 将电子邮件验证功能添加到现有验证功能

Question

首先抱歉，如果这可能涉及重复，但我决定打开一个新问题，因为我找不到我的问题的答案，其次请知道我仍在学习 Javascript。

我有一个验证功能，可以验证表单中的输入字段，一切正常，但我需要验证输入的电子邮件地址是否正确，我知道这可以通过类似于以下代码的代码来完成：

function validateEmail(email) 
{
    var re = /\S+@\S+\.\S+/;
    return re.test(email);
}

如何将上述代码添加到我现有的验证函数中？

我的代码如下：

function validate(){
    //form validation

    var name=document.getElementById("name");
    var surname=document.getElementById('surname');
    var nr=document.getElementById("nr");
    var email=document.getElementById("email");

    //name
  if (name.value=='') {
    name.style.backgroundColor="red";
    name.style.color="white";
    name.value="Name is required"
    return false;
  } 

 else if(isNaN(name.value)==false){
    name.style.backgroundColor="red";
    name.style.color="white";
    name.value="Name: Only enter letters A-Z"
    return false;
  } 

      //surname
     if (surname.value == ""){
    surname.style.backgroundColor="red";
    surname.style.color="white";
    surname.value="Surname is required"
    return false;
     }

    else if(isNaN(surname.value)==false){
    surname.style.backgroundColor="red";
    surname.style.color="white";
    surname.value="Surname: Only enter letters A-Z"
    return false;
  } 
    //number
    if (nr.value=='') {
    nr.style.backgroundColor="red";
    nr.style.color="white";
    nr.value="Number is required"
    return false;
  } 

 else if(isNaN(nr.value)==true){
    nr.style.backgroundColor="red";
    nr.style.color="white";
    nr.value="Number: Only enter numbers 0-9"
    return false;
  }      
    //email
    if (email.value==""){
    email.style.backgroundColor="red";
    email.style.color="white";
    email.value="Email is required"
    return false;   
    }

     return true;
} //end function


<input type="text" id="name" value="Name" class="textbox"  name="name" onfocus="if(this.value=='Name' || this.value=='Name is required' || this.value=='Name: Only enter letters A-Z' ) this.value='';" /><br />
    <br />
    <input type="text" id="surname" value="Surname" class="textbox"  name="surname"  onfocus="if(this.value=='Surname') this.value='';"  /><br />
    <br />
    <input type="text" value="Contact Number" class="textbox" id="nr" name="nr" onfocus="if(this.value=='Contact Number') this.value='';"   /> <br />
    <br />
    <input type="text" value="Email" class="textbox" id="email" name="email"onfocus="if(this.value=='Email') this.value='';" /><br />
    <br />

 <input type="submit" name="submit" class="butt" value="Send" onclick="return validate()"  />

Answer 1

随便用

email.value 获取电子邮件的价值

var re = /\S+@\S+\.\S+/;
if (!re.test(email.value)) { // if condition fails that is not valid email
    return false; //return false 
};

Answer 2

试试

 function validate(){
    //form validation

    var name=document.getElementById("name");
    var surname=document.getElementById('surname');
    var nr=document.getElementById("nr");
    var email=document.getElementById("email");

    //name
  if (name.value=='') {
    name.style.backgroundColor="red";
    name.style.color="white";
    name.value="Name is required"
    return false;
  } 

 else if(isNaN(name.value)==false){
    name.style.backgroundColor="red";
    name.style.color="white";
    name.value="Name: Only enter letters A-Z"
    return false;
  } 

      //surname
     if (surname.value == ""){
    surname.style.backgroundColor="red";
    surname.style.color="white";
    surname.value="Surname is required"
    return false;
     }

    else if(isNaN(surname.value)==false){
    surname.style.backgroundColor="red";
    surname.style.color="white";
    surname.value="Surname: Only enter letters A-Z"
    return false;
  } 
    //number
    if (nr.value=='') {
    nr.style.backgroundColor="red";
    nr.style.color="white";
    nr.value="Number is required"
    return false;
  } 

 else if(isNaN(nr.value)==true){
    nr.style.backgroundColor="red";
    nr.style.color="white";
    nr.value="Number: Only enter numbers 0-9"
    return false;
  }      
    //email
    if (email.value==""){
    email.style.backgroundColor="red";
    email.style.color="white";
    email.value="Email is required"
    return false;   
    }
   var re = /\S+@\S+\.\S+/;
   if (!re.test(email.value)) {
     email.style.backgroundColor="red";
    email.style.color="white";
    email.value="Email not proper"
    return false; 
   }

     return true;
} //end function