在表单提交中循环遍历每个“必需”字段

Question

我在这里遇到了麻烦。 我不能把我的大脑包裹起来！

我想要做的是在验证电子邮件地址之后提交一份表格，然后在我用“必需”类标记的每个输入中提交。 我真的很感谢有人向我展示如何循环使用这些并且只有在每个人填写时才提交。

<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>

Answer 1

您可以使用.filter()仅过滤掉空的元素，然后检查与过滤器匹配的元素的数量。 如果任何输入与过滤器匹配，则表示您有错误，不应发布。 像这样的东西：

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

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

Answer 2

    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;
}