在表單提交中循環遍歷每個“必需”字段

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