본문 바로가기
Script/jQuery

jQuery checkbox 요소 컨트롤 하는 방법

by 애플 로그 2021. 2. 4.
반응형

jQuery checkbox 요소 컨트롤 하는 방법

 

jquery.com 메인 로고

1. checkbox 가 체크 되어있는지 여부를 확인

  1) id인 경우

      $('input:checkbox[id="checkbox_id"]').is(":checked") == true

 

  2) name인 경우

      $('input:checkbox[name="checkbox_name"]').is(":checked") == true

 

Ex) $('input[name="checkbox_name"]').is(":checked")

 

2. checkbox 전체 갯수를 확인

$('input:checkbox[name="checkbox_name"]').length

 

3. checkbox 선택된 갯수

 $('input:checkbox[name="checkbox_name"]:checked').length

 

( 2,3번은 name 인 경우 가능 )

 

4. checkbox 전체 순회 하며 처리(동일한 name으로 여래개인 경우 전체를 컨트롤 할 수 있다.)

 

$('input:checkbox[name="checkbox_name"]').each(function() {

  this.checked = true; //checked 처리

  if(this.checked){  //checked 처리된 항목의 값

  alert(this.value);

}

});

 

  •   동일한 name 으로 1개 or 여러개 있을 경우에는 같은 name 으로 된 모든 checkbox 가 checked 처리된다.

5. checkbox value 값 가져오기

$('input:checkbox[id="checkbox_id"]').val();

 

6. checkbox checked 처리 하기

$('input:checkbox[id="checkbox_id"]').attr("checked", true); //checkbox checked 처리

 

굿!!

댓글