form validation-multiple <form>

时间:2015-09-24 04:27:09

标签: javascript html

我的html文档中有多个form标记,想要验证它们。但是验证功能不会给出任何结果。试着 将名称字段添加到<form> validation()不会返回任何结果。

当我仅使用一个<form>进行验证时,结果是正确的。 这是两个表单标签:

<div id="pinfo">
<form>
<fieldset>
<legend>Personal Information</legend>
Name:                                                          
<input type="text" name="name" value="Enter name">  
<br><br> 
Email:
<input type="email" name="eamil" value="Enter email id">
<br><br>
Confirm email id:
<input type="text" name="cemail" value="">
<br><br>
Password:
<input type="password" name="pass" value="">
<br><br>
Confirm password:
<input type="password" name="cpass" value="">
<br><br>    
</fieldset>
</form>
</div>

<div id="linfo">
<form>
<fieldset>
<legend>Location and Contact</legend>
Location:
State:

<script> 
function validateForm() { 
var eid = document.forms["loginform"]["emailid"].value; 
  if (eid == null || eid == "") { 
     alert("Email id must be entered."); 
     return false; 
   } 
var pwd = document.forms["loginform"]["password"].value; 
 if (pwd == null || pwd == ""){ 
     alert("Please enter the password."); 
     return false; 
  } 
var p = document.forms["locinfo"]["pno"].value; 
 if (p == null || p=="") { 
     alert("Please enter the phone no."); 
     return false; 
  } 
</script>

2 个答案:

答案 0 :(得分:0)

答案 1 :(得分:0)

您的代码中存在一些错误。 您没有在验证功能中使用表单名称作为“loginform”。 你错过的第二件事是表单元素上的“onsubmit”属性

这是适合您的工作代码

function validateForm() {
    console.log(document.forms["loginform"])
    var eid = document.forms["loginform"]["eamil"].value;
    if (eid == null || eid == "") {
        alert("Email id must be entered.");
        return false;
    }
    var pwd = document.forms["loginform"]["pass"].value;
    if (pwd == null || pwd == "") {
        alert("Please enter the password.");
        return false;
    }
    /*var p = document.forms["locinfo"]["pno"].value;
    if (p == null || p == "") {
        alert("Please enter the phone no.");
        return false;
    }*/
}
<div id="pinfo">
<form method="post" name="loginform" action="/" onsubmit="return validateForm()">
<fieldset>
<legend>Personal Information</legend>
Name:                                                          
<input type="text" name="name" value="">  
<br><br> 
Email:
<input type="email" name="eamil" value="">
<br><br>
Confirm email id:
<input type="text" name="cemail" value="">
<br><br>
Password:
<input type="password" name="pass" value="">
<br><br>
Confirm password:
<input type="password" name="cpass" value="">
<br><br> 
    <input type="submit" name="submit" />
</fieldset>
</form>
</div>