Question

我在按下（+）按钮时动态创建一组文本框，方法是克隆以下HTML模板：

<div id= "other_leaders" class="controls form-input">
  <input type="text" name="other_leader_fname[]" class="input_bottom other_leader_fname" id="other_leader_fname" placeholder="First Name" value="'.$val[0].'" />
  <input type="text" name="other_leader_lname[]" class="input_bottom other_leader_lname" id="other_leader_lname"  placeholder="Last Name" value="'.$val[1].'" />
  <input type="text" name="other_leader_email[]" class="other_leader_email" id="other_leader_email" placeholder="Email Address" value="'.$val[2].'" />
  <input type="text" name="other_leader_org[]" class="other_leader_org" id="other_leader_org" placeholder="Organisation/College" value="'.$val[3].'" />
  <span  class="remove btn"><i class="icon-minus"></i></span>      
</div>

我可以通过以下代码进行单一文本框验证：

  $("input[name*='other_leader_fname']").each(function(){
            if($(this).val()=="" || !RegExpression.test($(this).val()))
            {
                $(this).addClass('custom-error')
                fnameflag = 0;                    
           }
   });

现在我的问题是如果用户在该特定文本框组中填充任何一个文本框字段，如何对所有四个文本框进行空验证。

例如：如果我在<div>中输入ID为other_leader_fname的值，则应对此特定组的其他三个文本框执行空验证。

我该怎么做？

Answer 1

试试这个，您可以使用以下代码将验证规则应用于div中的所有文本框：

$("#other_leaders :input[type='text']").each(function(){
                if($(this).val()=="" || !RegExpression.test($(this).val()))
                {
                    $(this).addClass('custom-error')
                    fnameflag = 0;

                }
            });

Answer 2

您可以使用each()对.controls进行迭代，并使用filter检查每个组中的填充输入，以执行验证，如下所示：

$('.controls').each(function(){

  var $inputs = $(this).find('input');
  var filled = $inputs.filter(function(){
    return this.value != "";
  });
  if(filled.length){
     $inputs.each(function(){
        if($(this).val()=="" || !RegExpression.test($(this).val()))
        {
          $(this).addClass('custom-error')
          fnameflag = 0;
        }
      })
   }
});

Demo

旁注：由于上面是动态生成内容的模板，因此您应该删除id并使用类，因为id在文档中应该是唯一的。

Answer 3

因为你只有一个元素所以不需要循环它：

var $othLeader = $("input[name*='other_leader_fname']");
if($othLeader.val()=="" || !RegExpression.test($othLeader.val())){
    $(this).addClass('custom-error');
    fnameflag = 0;
}

如果你有表格，那么你可以在表格的提交功能中验证这一点。

如何根据条件在多组输入中执行验证

3 个答案:

Demo