제이쿼리로 선택한 node를 map으로 처리하기
조회수 1966회
몇개의 input태그의 값을 체크하는 코드를 작성하고 있습니다. 가급적 코드를 줄이려고 jquery 선택자를 사용하는 중입니다.
$('form[name="an"] .cell input').map(function(eachNode){
if(!eachNode.value){
console.log('값이 없음');
}else{
console.log('값이 있음');
}
});
$('form[name="an"] .cell input')
을 콘솔에서 입력해보면 length가 3이고 각각 input node를 가리키고 있는 객체가 나오는데 상술된 코드를 사용해보면 input값에 관계없이 '값이 없음'을 한번만 출력하고 끝냅니다.
map 내부가 어떻게 돌아가는지 궁금해서 console.log(eachNode)
를 돌려봤는데 0, 1, 2만 나오네요. 제가 map에 대해서 아직 잘못 이해하고 있는걸까요?
1 답변
-
API 문서 에 따르면
map( callback )
에서callback
에 해당하는 함수는Function( Integer index, Element domElement ) => Object
의 형태여야 합니다.즉 질문의 예시에서 eachNode에 사상된 것은 index이며, 만약 dom을 직접 접근하려면 두번재 인자를 사용해야 합니다.
map함수에서 개별대응되는 항목에 접근하려면 다음 두 가지 방법중 하나를 사용하면 될 것 같습니다.
$('form[name="an"] .cell input').map(function() { var node = $(this); if(!$node.val()) { console.log('값이 없음'); } else { console.log('값이 있음'); } });
dom element을 직접 사용하기
$('form[name="an"] .cell input').map(function(index,el) { if(!el.value) { console.log('값이 없음'); } else { console.log('값이 있음'); } });
댓글 입력