javascript - jquery 字段的表单空白检查

Question

我正在构建一个函数，它将检查表单的某些字段是否为空。然后，只有在没有空字段的情况下，我才使用此功能提交表单。

我测试字段是否为空的功能：

    function formCompleted(form){
      form.filter(':input').each( function(){
        if( $(this).val() === "" ){
          return false;
        };
      });
    };

提交表单的功能：

    $('#form-id').change(function(){
      if(formCompleted($('#form-id > *'))){
        alert("Form haven't empty fields");
      }else{
        alert('Form have empty fields');
      }
    });

问题

formCompleted 函数似乎总是错误的，即使所有字段都已填满。该表单包含输入 (type="number") 和一个选择（带有 3 个选项）。

有什么线索吗？

Answer 1

使用属性选择器，如果空字段计数为0，则返回true，表示没有空字段。

function formCompleted(form){
    return form.filter(':input[value=""]').length == 0;
};

Answer 2

试试这个：

function formCompleted(form){
  form.filter(':input').each( function(){
    if( $(this).val() === "" ){
      return false;
    };
  });
  form.filter('select').each( function(){
    if( $(this).val() === "" ){
      return false;
    };
  });
};

$('#form-id').change(function(){
  if(formCompleted($('#form-id'))){ // <----pass the form only
    alert('Form haven't empty fields');
  }else{
    alert('Form have empty fields');
  }
});

Answer 3

您忘记从 中返回 true formCompleted()，因此它将返回 false 或什么都不返回（未定义）。

所以在你的循环之后添加一个return true;语句，所以如果没有元素为空，它会返回 true。

function formCompleted(form){
    form.filter(':input').each( function(){
        if( $(this).val() === "" ){
          return false;
        };
    });
    return true;
};