检查以确保所有字段都已填写 Jquery

Posted 2023-05-09

【中文标题】检查以确保所有字段都已填写 Jquery

【英文标题】：Check to make sure all fields are filled Jquery

【发布时间】：2017-07-09 21:34:26

【问题描述】：

我正在尝试在 jquery 中为我的输入字段创建一个简单的验证器。 目前我得到以下内容：

function checkInputs()
var isValid = true;
$('.input-required').each(function() 
     if($(this).val() === '')
        isValid = false;
         return false;
             
 );
return isValid;

然后我得到了一个正确的按钮：

$('#confirm').click(function ()  
    alert(checkInputs());
);

但是即使输入为空，这也总是返回 true。 同样在完成这项工作后，如果所有输入都填写完毕，将启用一个按钮来点击。

对其进行了编辑，现在它有一个选择器，仍然始终为真。

提前致谢

【问题讨论】：

你有一个错字是你的代码，也许你的意思是 $('.input-required')。

哦该死的你是对的，添加它！但仍然总是返回 true

【参考方案1】：

尝试使用过滤器属性来获取具有required 属性的输入。

$('input').filter('[required]')

添加了检查输入是否已填充并启用或禁用button 的代码。请注意，如果我们使用它，$('#confirm').click(function()); 函数就没有什么意义了，因为这个按钮只有在输入填满时才会启用。

function checkInputs() 
  var isValid = true;
  $('input').filter('[required]').each(function() 
    if ($(this).val() === '') 
      $('#confirm').prop('disabled', true)
      isValid = false;
      return false;
    
  );
  if(isValid) $('#confirm').prop('disabled', false)
  return isValid;


$('#confirm').click(function() 
  alert(checkInputs());
);

//Enable or disable button based on if inputs are filled or not
$('input').filter('[required]').on('keyup',function() 
checkInputs()
)

checkInputs()

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <input required>
  <input required>
  <input required>
  <button id="confirm">check</button>
</form>

【参考方案2】：

尝试以这种方式定位元素： $('input[required]')

这应该可以解决问题。

【参考方案3】：

如果为0，则所有输入都被填充，否则返回0，表示任何一个或多个为空输入。

 function checkInputs()
  var flag = 0;
  $('input').each(function() 
       if($(this).val() == '')
         return flag = 1;
       
   );
  return flag;
  
  $('#confirm').click(function () 
      alert(checkInputs());
  );

【参考方案4】：

您的选择器正在寻找一个显然不存在的 tagName <input-required></input-required>。

为类添加点前缀

也可以使用filter()来简化

function checkInputs()
    return !$('.input-required').filter(function() 
         return !this.value;   
     ).length;

注意：如果收音机或复选框是该类元素集合的一部分，则它们将无法在收音机或复选框上使用，如果是这种情况，您需要为类型添加条件

【参考方案5】：

你忘了在 jQuery 中添加类符号：

function checkInputs() 
    var isValid = true;
    $('.input-required').each(function() 
     if($(this).val() === '')
        isValid = false;
         return false;
             
  );

  return isValid;

试试这个..