Question

我从jQuery开始，并尝试在表单验证中保存自己的大量代码。我想把所有表单字段放在一个数组中，使用each（）遍历数组以查看字段是否为空并返回错误（如果需要）。

一个问题;我的做法不起作用..

我使用以下方法


     var fields = [ "$('#name')", "$('address')" ];
     jQuery.each(fields,function(){
      if(this.val() == ""){
       alert(this.id+" is empty");
       return false;
      }
     });

当然我可以单独检查所有字段，但因为我有很多表单，这将是一个非常大的代码。

我的想法是否可能，如果是的话，怎么样？

好的，上面的问题已经完美解决了，但我现在有一个新问题

一旦我检查了所有字段是否为空，我想检查是否输入了有效的电子邮件。我使用以下代码：


    $("#reservationForm").live("submit", function(f){
     $(".formError").hide();
     if(!$('#agree').is(':checked')){
      $("#agree").after('You need to agree with the terms on the right');
      f.preventDefault();
     }else{
      $("#reservationForm").find("input[type=email], input[type=tel], input[type=text]").filter(function(){
       if($(this).val() == ""){
        $(this).css("border","solid 1px red").after('Please fill in your '+this.id+'');
        $(this).find("first-child").focus();
        f.preventDefault();
       }else if(!/\b[A-Z0-9._%+-]+@(?:[A-Z0-9-]+\.)+[A-Z]{2,4}\b/.test($("#mail").val())){
        $("#mail").css("border","solid 1px red").after('Please enter a valid email address');
       }
      });
     }
    });

问题是边框不会变为红色，并且不会显示应在电子邮件字段后显示的消息。只关注电子邮件字段，而不是其他任何内容。

哦，我实际上还有另一个'问题'，因为第一个孩子选择器似乎不起作用。代替第一个元素，最后一个元素被聚焦。（我也试过最后一个孩子，但那没有做到这一点。）

Answer 1

删除数组中的“”。您希望存储对元素的引用，而不是字符串; - ）

另外，请看一下：

http://bassistance.de/jquery-plugins/jquery-plugin-validation/

这是一个非常简单易用的jQuery表单插件！哦，你可能想把.val（）更改为.attr（“value”）（虽然val可能有效，但我不确定）

哦，如果仍然无效，请尝试$（this）而不是这个，而不是100％的jQuery处理这个超过$（这个）的方式

Answer 2

如何查找表单中是否有空元素：

var emptyElements = $('#formId')
    .find(':text, :radio, :checkbox, select')
    .filter(function() { 
        var isEmpty = $(this).val() == '';
        if (isEmpty) {
            alert(this.id + ' is empty');
        }
        return isEmpty; 
    });
if (emptyElements.length > 0) {
    return false;
}

jQuery validation plugin也值得一试。

Answer 3

$.each($('form').serializeArray(), function(i, field) {
    if (field.value.length == 0 || field.value.match('regex of invalid syntax')) {
         // handle invalid data properly.
    }
})

表单验证检查字段到数组

3 个答案: