获取字段集中所有jQuery输入的值

这是我在这里问的第一个问题。我有一个fieldset内有4个输入。如果完成4个中的至少2个，我想验证表单。我可以通过$("#communications input").val()获得第一个输入的值。获取字段集中所有jQuery输入的值

<fieldset class="input-group-fieldset bigger-labels" id="communications"> 
    <div class="row"> 
     <div class="columns twelve"> 
      <div class="input-group" id="pref-mail-wrap"> 
       <label>Email Address</label> 
       @Html.TextBoxFor(model => model.PrefferedEmail, new { @class = "contact-group" }) 

      </div> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="columns four"> 
      <div class="input-group" id="pref-phone-wrap"> 
       <label>Telephone No</label> 
       @Html.TextBoxFor(model => model.PrefferedPhoneNo, new { @class = "contact-group" }) 



      </div> 
     </div> 
     <div class="columns four"> 
      <div class="input-group" id="pref-sms-wrap"> 
       <label>SMS No</label> 
       @Html.TextBoxFor(model => model.PrefferedSmsNo, new { @class = "contact-group" }) 

      </div> 
     </div> 
    </div> 
    <div class="" id="pref-address-wrap"> 

     <div class="row fixed-width"> 
      <div class="columns twelve"> 
       <div class="input-group2"> 
        <label>Address </label> 

        @Html.TextBoxFor(model => model.PostalAddress) 

       </div> 
      </div> 

     </div>

先谢谢您， Kostas。

来源

2015-10-09 karva

如下使用.filter()。

var $completedInputs = $("#communications input:text").filter(function() { 
    //return the ones witn non-empty values 
    return $.trim(this.value) != ""; 
}); 

if ($completedInputs.length >= 2) { 
    //At least 2 inputs have been filled. 
}

$("#communications input:text")或$("#communications :text") =>所有的输入，其类型为文本

$("#communications input") =>所有的输入

来源

2015-10-09 11:02:20 lshettyl

谢谢。这实际上帮了我很多。 – karva

您可以使用jQuery的每个（）的返回选择更多然后1个元素：

来源

2015-10-09 10:56:53 vedbhawsar

谢谢。这很有帮助。 – karva

尝试这样的事情。

var count = 0; 
$('#communications input').each(function(index, item) { 
    if($(item).val()!=="") { 
     count ++; 
    } 
    return count <= 2; // break; if more than 2 have values 
    }); 

if(count >= 2) { 
    //valid 
}

更多详情： https://api.jquery.com/each/

来源

2015-10-09 10:57:22

感谢您的快速回复。 – karva

您可以使用filter()检查多少inputs都被赋予了值。试试这个：

var validInputs = $("#communications input").filter(function() { 
    return !$(this).val().trim() == ''; 
}).length; 

if (validInputs < 2) { 
    // form is invalid... 
}

来源

2015-10-09 10:57:57

谢谢。你的回答也很有帮助:) – karva

如果所有的输入具有相同的格式和验证是一样的尝试内fieldset

$("#communications input").each(function(i,v){ 

});

通过全部投入到迭代否则，你应该单独确认4个输入。

来源

2015-10-09 10:57:57 anmarti

我已经设置了我的验证。比方说，您将电子邮件字段留空。当你按下回车键时，会有一条消息告诉你完成它。我只是想让你完成电子邮件领域和另外一个。这是我无法管理的部分！感谢您的答复。 – karva

你可以使用jQuery的'validation'插件http://jqueryvalidation.org/files/demo/ – anmarti

我使用这个插件来验证我的表单。我现在试图创建一个自定义规则，以验证具有8个字段的表单。 – karva

您应该为所有这些元素input属性name，则它们序列化，并使用检查：

if($('#communications :input').serializeArray().length >=2)

'#communications input'就足以在你的情况

来源

2015-10-09 10:58:48

谢谢你的快速回答。我所有的输入都有一个名字。当我使用您提供给我的代码时，无论有多少输入为空或不输入，它都会返回true。 – karva

@KostasArva它不会序列化输入没有价值，简单的例子复制您的问题或至少在浏览器中呈现的HTML标记。也许你有其他类型的'：input'，不仅是文本框，然后尝试：'$（'＃communications：text'）。serializeArray（）.length'。请注意，文本框中的任何空白区域都会影响表单HTML5验证，但这可能也是您的问题，但我对此持怀疑态度 –

至少我已经弄明白了。感谢您的答复。 – karva

获取字段集中所有jQuery输入的值

回答

相关问题