2014-09-02 107 views
-1

尝试验证html表单,以便一旦填写完所有字段并输入有效的电子邮件地址,就会创建一个模拟邮件,其中包含表单中的详细信息。它仅在目前第一次工作,我希望它始终检查第一个和最后一个名称字段不是空的。使用javascript循环显示HTML表单

目前代码:

function validate_form(thisform){ 
     with (thisform){ 
     if ((validate_required(firstname,lastname,email,"All fields must be filled out!")==false) || (validate_email(email,"Not a valid e-mail address!")==false)){ 
      firstname.focus(); 
      lastname.focus(); 
      email.focus(); 
      return false; 
     } 
      return true;   
     } 
     } 

这里是我的表

<form name="registration" action="mailto:[email protected]?subject='example'" onsubmit="return validate_form(this)" method="post" enctype="text/plain"> 
First Name: <input type="text" name="firstname"> 
Last Name: <input type="text" name="lastname"> 
Email : <input type="text" name ="email"> 
<input type= submit value="Send email" onclick="return validateForm();">&nbsp;&nbsp;&nbsp; 
<input type="reset" value="Reset"> 
</form> 

我已删除了部分语法,阅读形式的代码

+0

当你说,它只能在第一时间,会发生什么,第二次?任何控制台错误? – Ozzy 2014-09-02 09:12:06

+0

如果电子邮件的输入格式正确,则会提交第二次,如果没有任何内容输入姓或名字段,仍然会提交。 @Ozzy – 2014-09-02 09:14:27

+0

听起来像你正在使用全局变量来检查表单是否已验证? – Ozzy 2014-09-02 09:15:45

回答

0

我创建了一个JSFiddle和只几乎没有改变它你的验证工作 - 主要是要删除return validateForm()input type=submit

http://jsfiddle.net/a34z195t/

<script> 
function validate_form(thisform) { 
    with(thisform) { 
     if ((validate_required(firstname, lastname, email, "All fields must be filled out!") == false) || (validate_email(email, "Not a valid e-mail address!") == false)) { 
      firstname.focus(); 
      lastname.focus(); 
      email.focus(); 
      return false; 
     } 
     return true; 
    } 
} 

function validate_required(field, field2, field3, alerttxt) { 
    with(field, field2, field3) { 
     if (value == null || value == "") { 
      alert(alerttxt); 
      return false; 
     } else { 
      return true; 
     } 
    } 
} 
</script> 
<form name="registration" action="mailto:[email protected]?subject='example'" onsubmit="return validate_form(this)" method="post">First Name: 
    <input type="text" name="firstname" /> 
    <br />Last Name: 
    <input type="text" name="lastname" /> 
    <br />Email : 
    <input type="text" name="email" /> 
    <br /> 
    <input type="submit" value="Send email" />&nbsp;&nbsp;&nbsp; 
    <input type="reset" value="Reset" /> 
</form>