jQuery确保所有表单字段都已填写

Posted 2023-05-08

【中文标题】jQuery确保所有表单字段都已填写

【英文标题】：jQuery make sure all form fields are filled

【发布时间】：2013-09-25 06:38:38

【问题描述】：

我有一个简单的表单，我正在为其进行客户端验证。 要进行验证，所有字段都不应留空。 这就是我的做法：

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

由于某种原因，我的函数总是返回 false，即使所有字段都已填满。

【问题讨论】：

你的函数没有返回任何东西。每个都为每个 .form-field 元素调用内部函数。 validateForm 从不返回值。

我感觉就是这样。谢谢！

【参考方案1】：

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

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

另一个建议：这要求您使用该表单域类来装饰所有表单域。您可能对使用不同的选择器进行过滤感兴趣，例如$('form.validated-form input[type="text"]')

编辑啊，我被打败了，但我的解释仍然有效，希望对您有所帮助。

【讨论】：

是的，非常有帮助，谢谢！我知道我在退货方面做得不对。对 $('form input[type="text"]') 的好建议也非常感谢，它更干净。

哦，开枪，你会想在你的表单上放一个类名，否则你会验证屏幕上的每个表单！

或 $('form.validated-form :input') 来捕获文本字段。

$(':required') 是更优雅的方法，实际上尊重根据需要在语义上定义的任何元素

【参考方案2】：

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

试试

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】：

这是一个类似的方法：

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

!! 只是将输入值转换为布尔值