제이쿼리로 선택한 node를 map으로 처리하기


몇개의 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에 대해서 아직 잘못 이해하고 있는걸까요?

  • 2016년 07월 02일에 작성됨

조회수 230


1 답변


좋아요
0
싫어요
채택취소하기

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('값이 있음');
    }
});
  • 2016년 07월 02일에 작성됨
    리눅스(유닉스) 기반의 시스템에서 웹 서비스를 개발하고 있습니다.

  • 감사합니다! 역시 레퍼런스는 언제나 옳군요! 영어공부는 더 해야겠지만 ㅠ    Snark   2016.7.4 09:36     

로그인이 필요한 기능입니다.

Hashcode는 개발자들을 위한 무료 QnA사이트 입니다. 작성한 답변에 다른 개발자들이 댓글을 작성하거나 좋아요/싫어요를 할 수 있기 때문에 계정을 필요로 합니다.
► 로그인
► 계정만들기
Close