javascript 노드리스트가 내용이 비어 있거나 모두 값이있는 경우 확인하는 방법은 무엇입니까?

Question

저는 자바 스크립트에 상당히 익숙하며 동적 ID를 사용하는 일부 필드를 ID 끝 부분에서 검사하여 값이 모두 입력되었거나 전혀 입력되지 않았는지 확인합니다. 사용자는 일부 값만 입력하고 나머지는 공백으로 남겨 둘 수 없습니다.

나는 어떤 작품, 아래 쓴 적이 있지만 나는이 일을 더 나은 방법?

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

한 루프가 비어 (또는 작성) 필드 카운터로 작동해야이 있어야한다 생각합니다. 카운터가 0이 아니고 객체의 길이가없는 경우 일부 필드에는 값이 있습니다.

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 전화로 확인하실 수 있습니다 - 다른 모든 경우에 거짓됩니다

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. 처음에는 간과했다.