Jquery Selectors - 每个里面的一个类答案

【问题标题】：Jquery Selectors - a Class inside a EachJquery Selectors - 每个里面的一个类
【发布时间】：2014-02-18 12:11:51
【问题描述】：

我有一个输入循环，其中有一个名为 guestline 的类属性，我试图确定输入字段是否已填充或不检查其类，但我坚持使用选择器。

      $("div#acompanhantes div.acompanhante").each(function(i){
            if($(this).next('.guestline').val() != '') {
                alert()
            }
            else {
                var fn = (vagasdispo > i ) ? 'show' : 'hide';
                $(this)[fn]();
            }


        });

HTML是

     <div id='acompanhante_1' class='acompanhante'>
<h3>1o. acompanhante </h3>

<div class="form-group"><label for="Invited1Name" class="control-label col-md-3">Nome</label>

    <div class="col-md-8"><input name="data[Invited][1][name]" class="guestline guestline_1 form-control"
                                 maxlength="250" type="text" id="Invited1Name"/></div>
</div>
<div class="form-group"><label for="Invited1Phone1" class="control-label col-md-3">Telefone de Contato</label>

    <div class="col-md-8"><input name="data[Invited][1][phone_1]" class="validate[required] large form-control"
                                 type="text" id="Invited1Phone1"/></div>
</div>
<div class="form-group"><label for="Invited1Document1" class="control-label control-label col-md-3">Número do
    documento de identidade</label>

    <div class="col-md-8"><input name="data[Invited][1][document_1]" class="validate[required] large form-control"
                                 maxlength="255" type="text" id="Invited1Document1"/></div>
</div>
<div class=""><label class="checkbox inline"><input type="hidden" name="data[Invited][1][special_needs]"
                                                    id="Invited1SpecialNeeds_" value="0"/><input type="checkbox"
                                                                                                 name="data[Invited][1][special_needs]"
                                                                                                 colname="special_needs"
                                                                                                 value="1"
                                                                                                 id="Invited1SpecialNeeds"/>Portador
    de Necessidade Especial </label></div>

【问题讨论】：

标签： jquery class this selector each

【解决方案1】：

输入是acompanhante 元素的后代而不是下一个兄弟元素，因此请使用.find() 而不是.next()

if($(this).find('.guestline').val() != '') {

【讨论】：

【解决方案2】：

使用find 而不是next

 if($(this).find('.guestline').val() != '') {

【讨论】：

【解决方案3】：

这样的事情怎么样？

var EmptyFields = $(".form-group :text[value='']");
if(EmptyFields.length > 0){
    alert('Please fill in all the text fields!');
    EmptyFields.addClass('error');
}else{
    $(".form-group .error").removeClass('error');
}

或

$(".form-group :text").each(function(){
    if($(this).is("[value='']")){
        $(this).addClass('error');
        alert('this field is empty: '+$(this).attr('name'));
    }else{
        $(this).removeClass("error");

    }
});

【讨论】：