JQuery, 여러 개의 checkbox 중 checked 된 checkbox 찾기

여러 개의 checkbox 중 원하는 checkbox가 체크 되어 있는지 검사하는 방법이다.

 

아래 소스에 대해 설명하면, 버튼 명 '주문'을 클릭하면 체크 여부를 검사하는 함수가 실행된다.

 

페이지 HTML 소스

<input type="checkbox" id="burger"/> burger 

<input type="checkbox" id="rice"  /> rice 

<input type="checkbox" id="beer"  /> beer 

<input type="checkbox" id="kimchi"/> kimchi 

 

<button id="next"> 주문 </button>

 

JQuery 소스

$("#next").onclick(function(){ 

 

  // 체크 개수 만큼 루프 돌리기

  $(document).find("input:checkbox").each(function(index){ 

 

    if( $(this).attr("id") == "rice" || 

        $(this).attr("id") == "kimchi" || 

        $(this).attr("id") == "beer"){ 

 

      // 모든 체크박스 중 특정 id만 체크여부 검사

      if(!$(this).is(":checked")){ 

        alert($(this).attr("id") + "가 체크되어 있습니다."); 

        return false; 

      } 

    } 

  }); 

}); 

 

 

위 예제 소스에서 kimchi가 체크되어 있으면

"kimchi가 체크 되어 있습니다!"라고 alert이 발생하게 됩니다.