Question

我收集了一个Array（我认为）所需的表单元素，并添加了'blur'监听器。

    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（）运行这个数组并检查字段是否有效 - 也就是说他们有一个我已经定义的'success'类。 / p>

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()？

Answer 1

因为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');
}

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

Answer 2

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

您可以使用.toArray()将{jQuery对象转换为Array，在.every()回调函数中将当前DOM元素传递给jQuery()以获取jQuery对象表示可以链接.hasClass()的元素。

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

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

Answer 3

我建议你使用array.map（）例如，input是数组 input.map(function(input){ return $(input).hasClass('is_glowing_success'); });

这只是一个更多here
的例子

为什么.every（）不是函数？

3 个答案: