Question

我正在尝试使电子邮件验证正常工作，但似乎无法找出问题所在。我希望它提醒输入的不是有效的电子邮件。我附带的代码是电子邮件功能和电子邮件的表单代码。感谢您的帮助，谢谢！

  {
            var emailfield=document.getElementById("emailaddress").value;  
            var atpos=emailfield.indexOf("@");  
            var dotpos=emailfield.lastIndexOf(".");  
            if (atpos<1 || dotpos<atpos+2 || dotpos+2>=emailfield.length){  
              alert("Please enter a valid email address with an @ and proper domain.")  
              return false;  

            }
            }

这是表格的代码。

     <form action='#' method='post' name='f1' id="VPN" onsubmit='return checkButons(this)'> 


  Aspects <br>          
<input type='radio' name='aspect' id='aspect1' value='security' />Security <br>
 <input type='radio' name='aspect' id='aspect2'value='speed' /> Speed<br> 


  Features:<br> 

  <input type='checkbox' name='feat1' id='feat1'value='highspeedvpn' /> High Speed VPN <br> 
   <input type='checkbox' name='feat2' id='feat2' value='transactionguard' />Transaction Guard <br> 
      <input type='checkbox' name='feat3' id='feat3'value='antivirus' /> Antivirus Addon <br> 






        <h3 id="generaltext">Fill out your information below:</h3>

        <p>
        Name:<input name="Name"id='name'size=:50 type="text" required><br>
        </p> 
        <p>

        Email Address:<input name="Emailaddress"id='emailaddress'size=:50 type="text" required><br> 
        </p>
        <p>
        Street Address:<input name="S_Address"id='s_address'size=:50 type="text" required><br></p>
        <p>
        Address 2:<input name="Address_2"id='address_2'size=:50 type="text" required><br></p>      
        <p>
        Zip Code:<input name="Zip"id='zip'size=:50 type="text" required><br>  
        <p>
        City:<input name="City"id='city'size=:50 type="text" required><br>

Answer 1

您可以对常规exp使用验证-

var email = text_email.value;
    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,}))$/;
    if (re.test(email)) {
        alert("Error msg");
        return false;
    }

Answer 2

请参阅以下内容。您可以将验证逻辑移至其他功能。

JavaScript：

function checkButons(element) {
  ...

  var emailfield = document.getElementById("emailaddress").value;
  var atpos = emailfield.indexOf("@");
  var dotpos = emailfield.lastIndexOf(".");

  if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= emailfield.length) {
    alert("Please enter a valid email address with an @ and proper domain.")
    return false;
  }

  ...
}

HTML：

<form action='#' method='post' name='f1' id="VPN" onsubmit='return checkButons(this)'>
    ....
    <p>
        Email Address:<input name="Emailaddress"id='emailaddress'size=:50 type="text" required><br> 
    </p>
    ....

</form>

Answer 3

浏览器将代替您使用<input name="Emailaddress"id='emailaddress'size=:50 type="text" required>使用电子邮件类型，而是为您进行验证，但是如果您想在服务器端进行额外的验证，则可以使用RegExp

Answer 4

您好，请检查此密码笔https://codepen.io/anon/pen/BeeZBv?editors=1111

这是您的JS代码，并且似乎可以正常运行，可能无法捕获所有可能的条件，但是绝对可以正常运行。你能让我知道什么不起作用吗？

这是代码

<input name="Emailaddress"id='emailaddress'size=:50 type="text" required>
<button onclick="validate()">Click me</button>

function validate() {
var emailfield=document.getElementById("emailaddress").value;  
            var atpos=emailfield.indexOf("@");  
            var dotpos=emailfield.lastIndexOf(".");  
            if (atpos<1 || dotpos<atpos+2 || dotpos+2>=emailfield.length){  
              console.log("Please enter a valid email address with an @ and proper domain.")  
              return false;  
            }
}

Answer 5

请在表单上保留一个提交按钮，因为一旦您在表单中进行了更多输入并在onSubmit上调用表单事件并且表单正在一个字段提交，我验证的代码表单就不会提交。

Function checkButons() {
  var emailfield = document.getElementById("emailaddress").value; 
  var atpos = emailfield.indexOf("@");
  var dotpos = emailfield.lastIndexOf(".");

  if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= emailfield.length) {
    alert("Please enter a valid email address with an @ and proper domain.")
    return false;
  }
}

HTML代码：

   <form action='#' method='post' name='f1' id="VPN" onsubmit="checkButons()">
 Email Address:<input name="Emailaddress"id='emailaddress'size=:50 type="text" required>
      Street Address:<input name="S_Address"id='s_address'size=:50 type="text" required>
     <input type="submit"  value="Submit">
 </form>

谁能告诉我为什么此电子邮件验证无效？

5 个答案: