2012-10-12 52 views
2

我在这里遇到了麻烦。我无法把我的大脑包裹起来!在表单提交中循环显示每个“必填”字段

我想要做的是在验证电子邮件地址之后提交表单,然后再输入每个我用“必需”类标记的输入。我真的很感谢有人向我展示过那些如何循环,只有当每一个填入提交。

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.button').click(function() { 
      var email = $("input.email").val();   
      var filter = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/; 
      if(filter.test(email)) { 
       $('input.required').each(function() { 
        var name = $("input.required").val(); 
        if(name != "") { 
         $('#form').submit(); 
        } else { 
         $('#error').show(); 
         return false; 
        } 
       }); 
      } 
      else { 
       $('#error').show(); 
       return false; 
      } 
     }); 
    }); 
</script> 
+0

为什么不使用验证器jquery插件? http://bassistance.de/jquery-plugins/jquery-plugin-validation/ –

回答

8

可以使用.filter()过滤出那些空元素,再检查与过滤器匹配的元素数量。如果有任何输入与过滤器匹配,则发生错误,不应发布。类似这样的:

var emptyFields = $('input.required').filter(function() { 
    return $(this).val() === ""; 
}).length; 

if (emptyFields === 0) { 
    $('#form').submit(); 
} else { 
    $('#error').show(); 
    return false; 
} 
+0

太棒了!谢了哥们! – doublenit

+0

@ user1741957我的荣幸! –

+0

@doublenit通过单击答案左侧的复选标记,可以将对您最有用的答案标记为“已接受”。只有一个答案可以接受。这将显示其他人,他们将来可能会读这个问题,哪个答案对你最有用。接受答案也会使人们更加热衷于在将来为您提供帮助,因为您将来在发布问题时会显示您的接受率。 –

3
var isValid = true; // Set the isValid to flag try initially 

    $('input.required').each(function() { // Loop thru all the elements 
     var name = $("input.required").val(); 
     if(name != "") { // If not empty do nothing 

     } else {   
      isValid = false; // If one loop is empty set the isValid flag to false 
      return false; // Break out of .each loop 
     } 
    }); 

    if(isValid){ // If valid submit form else show error 
     $('#form').submit(); 
    } 
    else{ 
     $('#error').show(); 
    return false; 
}