jQuery：如何同时验证复选框和输入文本？

Question

我有一个div，其中有2个复选框和2个输入文本，但我想验证或检查是否所有输入都为空以显示警报或错误，并且至少填充了一个输入（复选框或文本），因为我不这样做两个验证：1表示复选框，2表示输入文本...是否存在执行此操作的方法？

HTML

<div id="t_disp">
    <p>
        <label for="7x24">7x24</label>
        <input id="7x24" name="7x24" type="checkbox"/>
    </p>
    <p>
        <label for="5x8">5x8</label>
        <input id="5x8" name="5x8" type="checkbox"/>
    </p>
    <p>
        <label for="especial">Especial</label>
        <input id="especial" name="especial" type="text"/>
    </p>
    <p>
        <label for="ticket">Ticket</label>
        <input id="ticket" name="ticket" type="text"/>
    </p>
</div>

提前致谢！！

Answer 1

要获取填充/检查的输入数量：

var filled = $('#t_disp input').filter(function() { 
  return $(this).is('[type=checkbox]') ? this.checked : this.value;
}).length;

if ( filled ) {
   // at least one input is filled
} else {
   // all inputs are empty
}

Answer 2

对于文本输入，您可以检查该值。

$('#especial').val();
$('#ticket').val();

对于复选框，您可以检查是否已选中。

$('#7x24').attr('checked'); // returns 'checked' if checked
$('#5x8').attr('checked');

然后，您只需要将它们固定在一个条件下即可。 如果它们全部为空或未选中，则显示错误。

PS：根据我的经验，以数字开头的id=不能很好地工作。

Answer 3

您可以使用以下功能

function validate()
{

    var isFormValid = false;

        $("#t_disp input:text").each(function()
        {
      if ($.trim($(this).val()).length > 0)
           {      isFormValid = true;    }
        });

     var len =  $("#t_disp input:checked").length;
     if( len > 0 ) { isFormValid = true; }

        if (!isFormValid) 
        alert("Please fill atleast on one field.");

}