表单验证无效

时间:2016-03-05 20:14:38

标签: javascript html validation

这是我的代码:

当我输入姓名和电子邮件后,表单验证没有执行。我该怎么做才能验证用户输入的数据。我想转到另一个名为start.jsp的jsp页面,当我点击on Participate请帮助我摆脱这个,请告诉我它为什么以及为什么没有工作..

 <html>
<head>
<title>Aptitude Competition Online</title>
<link rel="stylesheet" type="text/css" href="index.css">
<script language="javascript">
function isEmpty(str) { 
if(str=="" )
{
return true;
} else return false;
}
function validate() {  
var nam = document.form[0].name.value; 
var ema = document.form[0].email.value; 
 if(isEmpty(nam)) 
  { 
       alert(Name should be filled out"); 
       document.form[0].name.focus;
       return false;
  }
 else if(isEmpty(ema) 
  {
       alert(E-mail should be filled out"); 
       document.form[0].email.focus;  
       return false;  
  } 
  else {  
       return true; 
       } 
       } 
  </script> 
  </head>
  <body>
  <div id="header1">
  <font id="font1">Aptitude Quiz</font>
  </div>
  <div id="email">
  <div id="inside">
  <font id="font2">Welcome to Aptitude Quiz</font><br><br><br>
   <form name="form">
   Name : <input type="text" name="name"><br><br>
   E-mail : <input type="text" name="email"><br><br>
   <input name="Participate" type="button" value="Participate"          onClick="validate()"><br><br>
   </form>
   </div>
    </div>
     <div id="footer">
      Contact Us : gmail@name.com 
      </div>
       </body>
      </html>

3 个答案:

答案 0 :(得分:2)

 <script type="text/javascript">
        function isEmpty(str)
        {
            if (str == "")
            {
                return true;
            }
            else
            {
                return false;
            }
        }
        function validate()
        {
            var nam = document.form.name.value
            var ema = document.form.email.value;
            if (isEmpty(nam))
            {
                alert("Name should be filled out");
                document.form.name.focus();
                return false;
            }
            else if (isEmpty(ema))
            {
                alert("E-mail should be filled out");
                document.form.email.focus();
                return false;
            }
            else
            {
                return true;
            }
        } 
    </script>

仅更改脚本部分

答案 1 :(得分:1)

按此更改

 <form name="form" method = "post" onsubmit = "return validate();">
  Name : <input type="text" name="name"><br><br>
  E-mail : <input type="text" name="email"><br><br>
  <button name="Participate" value="Submit" type = "submit"><br><br>
  </form>

答案 2 :(得分:1)

<html>
<head>
<title>Aptitude Competition Online</title>
<link rel="stylesheet" type="text/css" href="index.css">
<script type="text/javascript">
function validate()
{  
var nam = document.forms[0].name.value; 
var ema = document.forms[0].email.value; 
if(nam == "") 
  { 
       alert("Name should be filled out"); 
       //document.forms[0].name.focus;
       document.getElementById("name").focus();
       return false;
  }
 else if(ema =="") 
  {
       alert("E-mail should be filled out"); 
       //document.forms[0].email.focus;
        document.getElementById("email").focus();
       return false;  
  } 
  else {  
       return true; 
       } 
}

  </script> 
  </head>
  <body>
  <div id="header1">
  <font id="font1">Aptitude Quiz</font>
  </div>
  <div id="email">
  <div id="inside">
  <font id="font2">Welcome to Aptitude Quiz</font><br><br><br>
   <form name="form">
   Name : <input type="text" name="name" id="name"><br><br>
   E-mail : <input type="text" name="email" id="email"><br><br>
   <input name="Participate" type="button" value="Participate" onClick="validate()"><br><br>
   </form>
   </div>
    </div>
     <div id="footer">
      Contact Us : gmail@name.com 
      </div>
       </body>
      </html>