检查输入框数组是否为空

Question

最好是想在jQuery中进行此操作，并通过简单的验证来检查输入框是否为空。 但是，这些是输入框的动态数组。 该代码应该更有意义：

<input type="text" id="qtn" name="question" />
<input type="text" name="answer[]" />
<button type="button" id="btn"> Save </button>

我了解问题输入的通常想法将涉及以下内容：

$('#btn').click(function () {
    var question = $.trim($('#qtn').val());

    // Check if empty of not
    if (question === '') {
        alert('Text-field is empty.');
        return false;
    } else {
        $('#form').submit();
    }
});

对于answer[]输入类型，这将如何工作，因为会有动态数量的答案，并且要确保无论用户选择了多少，都将所有这些框都填满。

谢谢！

Answer 1

您可以使用filter()方法在form找到任何空文本框。 还要注意，您应该检查form本身的提交，而不是单击按钮，因为有人可以在焦点位于文本框上时按回车键来提交表单。 尝试这个：

$('form').submit(function(e) {
    var $emptyFields = $(this).find(':text').filter(function() {
        return this.value.trim() == '';
    });

    if (!$emptyFields.length) {
        e.preventDefault(); // stop the form submission
        alert('Please fill out all fields');
    } else {
        $form.submit();
    }
}); 

Answer 2

这样尝试

$('#btn').click(function () {
   var checkValidate = false;
   $('input[type=text]').each(function() {
          if(!$.trim($(this).val())){
            alert('Some fields are empty');
            checkValidate = true;
            return false;
          }
   });
   if(!checkValidate) {
      $('#form').submit();
   }
});

演示版

Answer 3

$('#btn').click(function () {
    var getTargetText = $(":text").filter(function() { return this.value==""; });
    if($(getTargetText[0]).val()=="") {
        alert("Please Enter this Field");
        $(getTargetText[0]).focus();
        return false;
    }
});

是的，作为Rory McCrossan的 “答案”，可以选择过滤器。 我只是修改了目标为哪个实际文本框为空。