为什么 .every() 不是函数？

Question

我已经收集了所需表单元素的数组（我认为），并添加了“模糊”侦听器。

     var formInputs = $(':input').filter('[required]');
  formInputs.each(function(i) {
    $(this).on('blur', function() { // Each time we leave a 'required' field, check to see if we can activate the 'submit' button.
      submitEnabler(formInputs);
    });
  });

因此，一旦有人离开了这些字段之一，我想使用 .every() 遍历此数组并检查这些字段是否有效 - 即它们是否具有我定义的“成功”类。

 function isValid(input) {
  return input.hasClass('is_glowing_success');
}

function submitEnabler(inputs) {

  console.log(inputs.every(isValid));
}

我不断回来：

 Uncaught TypeError: inputs.every is not a function
    at submitEnabler

现在，我可以做这样的事情……

 for (var i = 0; i < inputs.length; i++) {
    if ($(inputs[i]).hasClass('is_glowing_success')) {
      console.log('yes');
    } else {
      console.log('no');
    }
  }

但是，为什么我不能只使用： Array.Prototype.every() ？

原文由 CodeFinity 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

jQuery 没有 .every() 方法。 .every 定义在 Array.prototype 。

You can use .toArray() to convert jQuery object to an Array , within .every() callback function pass current DOM element to jQuery() 获取元素的 jQuery 对象表示，其中 .hasClass() 可以链接。

 function submitEnabler(inputs) {
  console.log(inputs.toArray().every(isValid));
}

function isValid(input) {
  return $(input).hasClass('is_glowing_success');
}

原文由 guest271314 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

因为 jQuery 对象没有 every 方法，而 formInputs 是一个 jQuery 对象。

如果您想要一个数组，请调用 get() 获取一个。

我已经收集了所需表单元素的数组（我认为）……

不，它只是 jQuery 对象。 jQuery 对象非常 _类似于数组_，但它们不是数组。更糟糕的是，它们有一些类似数组的方法（例如 filter 和 map ），它们使用与等效方法 不同 的参数调用回调 Array.prototype

在 isValid 中，您需要处理您现在正在处理原始 DOM 元素的事实，这意味着要么用 jQuery 对象包装它并使用 hasClass ：

 function isValid(input) {
  return $(input).hasClass('is_glowing_success');
}

或者使用 DOM 的 classList ：

 function isValid(input) {
  return input.classList.contains('is_glowing_success');
}

后者适用于所有现代浏览器，但不适用于所有旧浏览器。但是，它可以在旧浏览器上进行 polyfill。有关 MDN 的更多信息。

原文由 T.J. Crowder 发布，翻译遵循 CC BY-SA 3.0 许可协议