如果 javascript 节点列表的内容全部为空或全部有值，如何检查？

Question

我是 javascript 的新手，正在检查 ID 末尾带有动态 ID 的一些字段，看看它们是否在所有字段中都输入了值，或者 none 他们中的所有。不应允许用户仅在其中一些中输入值而将其他值留空。

我已经写了下面的内容，但我觉得一定有更好的方法吗？:

var x = document.querySelectorAll('[id^="entryField"]');

for (var i = 0; i < x.length; ++i) {
   if (x[i].value == "") {
      for (var i = 0; i < x.length; ++i) {
         if (x[i].value != "") {
            alert("Please enter a value");
         }
      }
   }
}

Answer 1

一个循环应该与空（或填充）字段的计数器一起使用。如果计数器不为零且没有对象的长度，则某些字段有值。

var x = document.querySelectorAll('[id^="entryField"]'),
    empty = 0;

for (var i = 0; i < x.length; ++i) {
    if (x[i].value == "") {
        ++empty;
    }
}
if (empty !== 0 && empty !== x.length) {
    alert("Please enter a value");
}

Answer 2

您可以检查两次 every 调用，如果所有元素都已填充或 none 个元素已填充，则以下情况为真 - 其他情况均为假：

var x = document.querySelectorAll('[id^="entryField"]');

var allowed = function allOrNone(elements) {
  return Array.prototype.every.call(x, function(v) {
    return v.value && v.value != "";
  }) || Array.prototype.every.call(x, function(v) {
    return !v.value || v.value == "";
  });
}

console.log(allowed(x));

<input id="entryFieldFoo">
<input id="entryFieldBar">

Answer 3

这将是一个更简单的版本：

  var x = document.querySelectorAll('[id^="entryField"]');

  const inputs = Array.from(x);
  const allInput = inputs.every(input => {
    return (input.value != "");
  });
  const allEmpty = inputs.every(input => {
    return (input.value == "");
  });

  if (allInput || allEmpty) {
      alert('xxxxxx');
  }

ES5 实现：

  var x = document.querySelectorAll('[id^="entryField"]');

  var inputs = Array.from(x);
  var allInput = inputs.every(function(input) {
    return (input.value != "");
  });

  var allEmpty = inputs.every(function(input) {
    return (input.value == "");
  });


  if (allInput || allEmpty) {
      alert('xxxxxx');
  }

编辑：支持 allInput 或 allEmpty。一开始就被忽视了。

如果 javascript 节点列表的内容全部为空或全部有值，如何检查？

How to check javascript nodelist if it's contents are either all empty or all have values?

javascript

arrays

nodelist