jQuery 적어도 5 개의 입력에 데이터가 있음을 확인하십시오.

Question

페이지에 많은 입력이 있으며 적어도 5 개의 항목이 채워져 있어야합니다. 그리고 만약 아니라면 적어도 5를 채워야한다는 메시지를 보여주세요. 지금까지 나는 다음을 시도했지만 반복해서 오류를 반복해서 보여줍니다. 이 일을하는 올바른 방법은 무엇입니까?

$('div.inputs input').each(function(i) { 
    $input = $(this); 
    while (i < 5) { 
     if ($($input).val() == '') { 
      alert('must fill at least 5 items!'); 
     } 
    } 
});​ 

Answer 1

당신은 더 나은 선택을 만들 수 있습니다 :

if ($('div.inputs input[value!=""]').length < 5) { 
    alert('must fill at least 5 items!'); 
} 

설명 :

div.inputs input[value!=""] 선택하면 다음 value 속성에서 무언가가 모든 입력 필드를 선택하고, 선택한 항목의 길이를 가져올 수 있습니다.

이전 솔루션 (어떻게 든) 작동하지만 더 나은 일 추천 : KARASZI 이스트 반의 대답에 표시된

if ($('div.inputs input').filter(function() { return $(this).val().length > 0; }).length < 5) { 
    alert('must fill at least 5 items!'); 
} 

Answer 2

방법은 깔끔한하지만, 지금까지 설명과 같은 코드 및 잘못된 것입니다 당신이 그것을 해결하는 방법은 (주) 문제가있는 while 조건이 :

while(i<5) 

... 변수, i을 평가하고, 그이 루프의 내용에 의해 변경되지 않습니다 . .each() 루프의 첫 번째 반복에서 i은 0이므로 while 조건이 참일 경우 이되고 계속 인 경우 무한 루프가 발생합니다. 이 같은 뭔가를 할 수

는 값을 테스트하는 각 입력을 통해 코드와 루프의 일반적인 구조를 유지하려면 :

카운터 빈 증가하지 않습니다 각 입력에 대해,이다

var filled = 0; 

$('div.inputs input').each(function (i) { 
    if (this.value != '') { 
     filled++; 
     if (filled === 5) 
      return false; 
    } 
}); 

if (filled < 5) { 
    alert('must fill at least 5 items!'); 
} 

다음 루프 후 카운터를 확인하십시오. .each() 콜백 함수에서 false을 반환하면 .each() 루프가 즉시 중지됩니다. 최소 5 개의 비어 있지 않은 값에 도달하면 계산을 계속할 필요가 없습니다.