jQuery确保填写所有表单字段

I have a simple form I'm making client side validation for. To validate, none of the fields should be left blank. This is how I go at it:

我有一个简单的表单，我正在进行客户端验证。要进行验证，不应将任何字段留空。这是我的方式：

function validateForm() {
  $('.form-field').each(function() {
    if ( $(this).val() === '' ) {
      return false
    }
    else {
      return true;
    }
  });
}

For some reason, my function always returns false, even though all fields are filled.

出于某种原因，即使填写了所有字段，我的函数也总是返回false。

4 个解决方案

#1

You cannot return false from within the anonymous function. In addition, if it did work, you would return false if your first field was empty, true if not, and completely ignore the rest of your fields. There may be a more elegant solution but you can do something like this:

您不能在匿名函数中返回false。此外，如果它确实有效，如果第一个字段为空，则返回false，否则返回true，并完全忽略其余字段。可能有一个更优雅的解决方案，但你可以做这样的事情：

function validateForm() {
  var isValid = true;
  $('.form-field').each(function() {
    if ( $(this).val() === '' )
        isValid = false;
  });
  return isValid;
}

Another recommendation: this requires you to decorate all of your form fields with that formfield class. You may be interested in filtering using a different selector, e.g. $('form.validated-form input[type="text"]')

另一个建议：这需要您使用该formfield类装饰所有表单域。您可能对使用其他选择器进行过滤感兴趣，例如： $（'form.validated-form input [type =“text”]'）

EDIT Ah, I got beat to the punch, but my explanation is still valid and hopefully helpful.

编辑啊，我打了一拳，但我的解释仍然有效，希望有帮助。

#2

You were returning from the inner function not from the validate method

您从内部函数返回而不是从validate方法返回

Try

尝试

function validateForm() {
    var valid = true;
    $('.form-field').each(function () {
        if ($(this).val() === '') {
            valid = false;
            return false;
        }
    });
    return valid
}

#3

function validateForm() {
    var invalid= 0;
    $('.form-field').each(function () {
        if ($(this).val() == '') {
            invalid++;
        }
    });

   if(invalid>0)
       return false;
   else
       return true;
}

#4

Here is a similar approach:

这是一个类似的方法：

function validateForm() {
  var valid = true;
  $('.form-field').each(function() {
    valid &= !!$(this).val();
  });
  return valid;
}

!! just converts input value to bool

！只是将输入值转换为bool

#1

function validateForm() {
  var isValid = true;
  $('.form-field').each(function() {
    if ( $(this).val() === '' )
        isValid = false;
  });
  return isValid;
}