使用for循环检查所有元素是否满足条件

Question

我基本上尝试使用以下代码检查所有输入字段是否有效：

 addData (input){

   var isValid = false;    

   for (var i = 0, ii = input.length; i < ii; ++i) {          

      if ($('#' + input[i].id).hasClass('valid')) {
          isValid = true;              
      }
   }

   if (isValid) {
     //do stuff
   }
 }

input.length 总共为 3，我想检查所有 3 个输入字段是否都有效。在我的示例中，它只检查最后一个输入元素。在related posts 中，我找不到使用 for 循环解决它的方法。有人可以帮忙吗？

感谢所有有用的答案：最后，我调整了 Máté Safranka 的答案：

var isValid = input.toArray().every(element => $('#' + element.id).hasClass('valid'))

使用 .toArray() 将 jQuery 对象转换为 Array >> see here 以获取更多信息。定义 true 或 false 不是 不再需要了。

Answer 1

您永远不会将 isValid 设置为 false，因此只要至少有一个输入有效，结果就会有效。

最好交换真/假并检查任何无效的，例如：

addData (input){

 var isValid = true;    

 for (var i = 0, ii = input.length; i < ii; ++i) {          
   if (!$('#' + input[i].id).hasClass('valid')) {
      isValid = false;              
   }
 }

 if (isValid) {
  //do stuff
 }
}

---

注意：使用循环还有其他选择，但这是为了回答在 OPs 问题中修复循环的明确问题。

Answer 2

你错了。您假设在元素有效之前无效。并且您应该假设有效，直到一个元素无效：

addData (input){
   var isValid = true;    

   for (var i = 0, ii = input.length; i < ii; ++i) {          

      if (!($('#' + input[i].id).hasClass('valid'))) {
          isValid = false;              
      }
   }

   if (isValid) {
     //do stuff
   }
}

Answer 3

正如其他人所说，您需要先将isValid 设置为true，然后从第一个无效字段开始，将其设置为false 并打破循环。

但如果 input 真的是一个数组，我会使用 input.every 代替：

addData (input){
    if (input.every(function(element) { return $(element).hasClass('valid'); })) {
        // Do stuff
    }
}

Array#every 为数组中的项目调用回调，如果回调为所有项目返回真值，则返回 true，或者如果回调返回虚假值，则返回 false（并立即停止） .

或者你可以使用 jQuery 的 filter:

addData (input){
    if ($(input).filter(':not(.valid)').length === 0) {
        // Do stuff
    }
}

---

Array#every 如果可以使用 ES2015+ 箭头函数会更简洁：

addData (input){
    if (input.every(element => $(element).hasClass('valid'))) {
        // Do stuff
    }
}

Answer 4

如果input是一个数组，可以使用.every()：

var isValid = input.every(it => $('#' + it.id).hasClass('valid'));

如果input 不是数组，您可以使用Array.from() 将其转换为数组。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every

注意： 正如 cmets 中所指出的，这适用于 IE10 及更高版本。大多数时候这应该不是问题（Windows 10 附带 IE11 和 Edge，理论上每个商业最终用户现在都应该升级），但值得注意的是，如果您必须支持旧平台。

Answer 5

anding true 和 isValid （而不是直接分配 true）将使它成为第一个 false 值将使整个条件为 false。只需确保在循环之前以 isValid 开头为 true。

isValid = true;

// inside the loop

isValid = isValid && true;