检查是否至少有一行被填充

Question

我有3行，每行3个输入。我需要的是检查是否至少在一行中填写了所有的输入。如果一行被填充，那么我们转到其他页面。哪一行填满没有区别，甚至可以是最后一行。 这里是我的一段代码：

   <div class="div-rows row-1"> 
       <input name="kfz_first_name" type="text" placeholder="Vorname" data-input="1"/> 
       <input name="kfz_last_name" type="text" placeholder="Nachname" data-input="1"/> 
       <input name="kfz_birthday" class="datepicker" type="text" placeholder="Geburtsdatum" data-input="1"/> 
       <div class="clear"></div> 
      </div> 
      <div class="div-rows row-2"> 
       <input name="kfz_first_name" type="text" placeholder="Vorname" data-input="2"/> 
       <input name="kfz_last_name" type="text" placeholder="Nachname" data-input="2"/> 
       <input name="kfz_birthday" class="datepicker" type="text" placeholder="Geburtsdatum" data-input="2"/> 
       <div class="clear"></div> 
      </div> 
      <div class="div-rows row-3"> 
       <input name="kfz_first_name" type="text" placeholder="Vorname" data-input="3"/> 
       <input name="kfz_last_name" type="text" placeholder="Nachname" data-input="3"/> 
       <input name="kfz_birthday" class="datepicker" type="text" placeholder="Geburtsdatum" data-input="3"/> 
       <div class="clear"></div> 
      </div> 
      <br/> 
      <a href="#" class="x-btn">click</a> 

     var zaza = true; 
     $('.div-rows input').each(function(){ 
      if ($.trim($(this).val()) == "") { 
       $(this).addClass('red-border'); 
       zaza = false; 
      } 
      if (zaza == false) { 
       return false; 
      } 
     }); 

Answer 1

您有一个范围的问题。 return false打破$.each部分。迭代后检查错误。

var zaza = true; 
$('.div-rows input').each(function(){ 
    if ($.trim($(this).val()) == "") { 
     $(this).addClass('red-border'); 
     zaza = false; 
    } 
}); 
if (zaza == false) { 
    return false; 
} 

Answer 2

像这样的东西应该可以工作，而不是测试，但你会明白。

$(document).ready(function() { 
    $(document).on('click', '.x-btn', function() { 
    var canContinue= true; 

    $('.div-rows').each(function() { 
     var allInRowsAreEmpty = true; 

     $('input', $(this)).each(function() { 
     if($(this).val() != '') { // $(this) = the current input in the current .div-rows 
      allInRowAreEmpty = false; 
     } 
     }); 

     if(allEmpty) { 
     $(this).addClass('your-error-class'); // $(this) is the current .div-rows 
     canContinue= false; 
     } 
    }); 

    if(canContinue) { 
     // do your thing 
    } 
    } 
});