JavaScript验证不提醒用户

Question

我正在使用JavaScript来验证提交到数据库的Web表单，我编写了表单和验证代码，但它似乎没有工作。

当表格完成并且有效时，它将转到单独HTML文件中的成功页面，但如果该表格无效，表格上的文本将变为红色，弹出消息框并提示用户认为它是无效的。在Chrome和IE浏览器中，它似乎显示错误，但仍然转到成功页面。消息框也没有出现，我只能看到文本变成红色，然后才进入成功页面。

我想知道如何解决这个问题。我在互联网上搜索，但没有找到解决办法。

我有一个叫validateForm()的函数，它是一系列检查字段是否有效的if语句，如果不是，称为'result'的变量设置为false，最后它会发送警报消息并返回变量'result'。

我的提交按钮的代码是在这里：

<input type="submit" name="submit" value="Submit" onclick="return validateForm();" /> 

成功页面在表单代码设置为“行动”。

这里是我的验证方式：

function validateForm(){ 
    var result = true; 
    var msg = ""; 

    if(document.ExamEntry.name.value==""){ 
     msg+="You must enter your Name \n"; 
     document.ExamEntry.name.focus(); 
     document.getElementById('name').style.color="red"; 
     result = false; 
    } 

    if(document.ExamEntry.subject.value==""){ 
     msg+="You must enter the Subject \n"; 
     document.ExamEntry.subject.focus(); 
     document.getElementById('subject').style.color="red"; 
     result = false; 
    } 

    if(document.ExamEntry.examNumber.value=="") 
    { 
     msg+="You must enter the Examination Number \n"; 
     document.ExamEntry.examNumber.focus; 
     document.getElementById('examnumber').style.color="red"; 
     result = false; 
    } 

    if(document.ExamEntry.examNumber.value.length!=4) 
    { 
     msg+="Your Examination Number must be 4 characters long \n"; 
     document.ExamEntry.examNumber.focus; 
     document.getElementById('examnumber').style.color="red"; 
     result = false; 
    } 

    var lvlmsg=""; 
    for(var i=0; i < document.ExamEntry.level.length; i++) 
     { 
      if(document.ExamEntry.level[i].checked) 
      { 
       lvlmsg = document.ExamEntry.level[i].value; 
       break; 
      } 
     } 
    if(lvlmsg=="") 
     { 
      msg+="You Must Indicate Your Level"; 
      result=false; 
      document.getElementById('radioButtons').style.color="red"; 
     } 
    else 
     { 
      alert(lvlmsg); 
     } 

    if(msg==""){ 
     return result; 
    } 
    else{ 
     alert(msg); 
     return result; 
    } 
} 

Answer 1

我创建了一个表格，而不单选按钮，改变了函数调用。

我认为错误是在这里：

<form name="ExamEntry" method="POST"> 
    <input type="text" id="name" name="name" /> 
    <input type="text" id="subject" name="subject" /> 
    <input type="text" id="examnumber" name="examNumber" /> 
    <input type="submit" name="submit" value="Submit" onlick="return validateForm()" /> 
</form> 

我改变了函数调用onsubmit（因为我认为这是更好的做法），并return validateForm()简单validateForm()。你为什么想要return声明？对我来说没有意义。

http://jsfiddle.net/rcsole/cqy7q/