Javascript表单验证-can'；无法验证多个字段

当按下提交按钮时，我试图获得一个包含多个字段的表单

如果某个字段无效，则该字段旁边会显示一条消息。我可以显示其中一条无效消息，但不是所有消息。下面是我正在使用的函数

function checkForm() {           
    document.getElementById("test").onsubmit=function(){
        var title = document.getElementById("titles");
        if (title.selectedIndex == -1) {
            return null;
        }

        var email = document.getElementById('email');
        //Regular Expression for checking email
        var emailRegEx = /[-\w.]+@([A-z0-9][-A-z0-9]+\.)+[A-z]{2,4}/;
        if (!emailRegEx.test(email.value)) {
            document.getElementById("errEmail").style.display="inline";
            return false;
        }

        if(document.getElementById("fname").value==""){
            document.getElementById("errfName").style.display="inline";
            return false;
        } 
        else {
            return true;
        }

        if(document.getElementById("lname").value==""){
            document.getElementById("errlName").style.display="inline";
            return false;
        } 
        else {
            return true;
        }       
    }   
}

下面是html

<form name ="reg" id="test">
   <fieldset id="controls">

     <div>
     <label for="title">Title: </label>
     <select id="titles">
         <option value="mr" selected="selected">Title</option>
         <option value="mr">Mr.</option>
         <option value="mrs">Mrs.</option>
         <option value="ms">Ms.</option>
         <option value="miss">Miss</option>
     </select>
    </div>

    <div>
      <label for="fname">First Name: </label>
      <input id="fname" type="text"><span id="errfName" class="error">* Please Enter a First Name</span>
     </div>


    <div>
      <label for="lname">Last Name: </label>
      <input id="lname" type="text"><span id="errlName" class="error">* Please Enter a Last Name</span>
     </div>


     <div>
        <label for="email">Email: </label>
        <input id="email" type="text" size="40"><span id="errEmail" class="error">* Please enter a valid email</span>
        </div>
     <div>
         <input type="submit" value="submit">
      </div>
   </fieldset>
</form>
</body>
</html>

标题：
标题
先生
夫人
太太
错过
名字：
*请输入一个名字
姓氏：
*请输入姓氏
电邮：
*请输入有效的电子邮件

试试这个：

function checkForm() { 
   var errors = [];      
   document.getElementById("test").onsubmit=function(){
    var title = document.getElementById("titles");
    if (title.selectedIndex == -1) {
        return null;
    }

    var email = document.getElementById('email');
    //Regular Expression for checking email
    var emailRegEx = /[-\w.]+@([A-z0-9][-A-z0-9]+\.)+[A-z]{2,4}/;
    if (!emailRegEx.test(email.value)) {
        errors.push("errEmail");
    }

    if(document.getElementById("fname").value==""){
        errors.push("errfName");
    } 

    if(document.getElementById("lname").value==""){
        errors.push("errlName");
    } 
    if(errors.length > 0 ){
        for(var i=0;i<errors.length;i++){
          document.getElementById(errors[i]).style.display="inline";
         }
         return false;
     }else{
       return true
     } 
   }   
 }

函数checkForm（）{
var错误=[]；
document.getElementById（“test”）.onsubmit=function（）{
var title=document.getElementById（“titles”）；
如果（title.selectedIndex==-1）{
返回null；
}
var email=document.getElementById（'email'）；
//用于检查电子邮件的正则表达式
var emailRegEx=/[-\w.]+@（[A-z0-9][A-z0-9]+\）+[A-z]{2,4}/；
如果（！emailRegEx.test（email.value））{
错误。推送（“错误电子邮件”）；
}
if（document.getElementById（“fname”）.value==“”）{
错误。推送（“errfName”）；
} 
if（document.getElementById（“lname”）.value==“”）{
错误。推送（“errlName”）；
} 
如果（errors.length>0）{
对于（var i=0；i）您的html看起来像什么？您的“return false；”正在退出函数。因此，一旦出现第一个错误，它就会返回false；Bamn..停止执行其他测试。与您的“return true；”相同。一旦出现上述任何一种情况，您将退出其余的测试。谢谢James，关于如何继续的建议？创建一个包含每个输入错误的javascript对象。然后在最后返回该对象。@user3185835我更新了一个答案。看看这是否适合您。如果我有另一个函数在字段w中输入默认文本这是否仍然有效？例如，函数textHint（）{var defaultText=“请输入您的名字”var txtElem=document.getElementById（“fname”）；txtElem.value=defaultText；txtElem.style.color=“#A8A8A8”txtElem.style.fontStyle=“italic”；当我在字段中输入默认文本时，它似乎将此作为有效条目。如果（document.getElementById（“fname”）.value==“”）是否将默认文本视为有效条目？如果“first name”字段中有一个“default”，那么它是有效的，因为根据测试，它不等于“”，因为如果（fname）=“”，测试就是这样做的。因为它不是空的，因为您有默认内容。所以，您有两个选项。1.）更新您的条件以执行以下操作：if（fname==“| | fname==“无论默认文本是什么”）或2.）或当用户“单击/聚焦”在输入字段时，默认文本会消失。我的意思是，实际上有很多选项。使用默认文本隐藏跨距/div。显示错误发生的时间等。这取决于你想要什么-选项1非常明显-我想我已经盯着这个太久了。詹姆斯，你是个明星！