본문 바로가기

Notice
Recent Posts
Recent Comments
«   2025/10   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Archives
Total
Today
Yesterday
관리 메뉴

[JQUERY] jQuery checkbox 제어하기 본문

개발/자바스크립트

[JQUERY] jQuery checkbox 제어하기

일산번개 2019. 1. 16. 19:50

1. checkbox checked 여부 :


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


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


 


=>  $('input[id="checkbox_id"]') + 옵션 형태로 작성 해도 문제는 없다


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); 


      }


 });


 


5. checkbox 전체 순회 하며 값을 값을 비교하여 checked 처리


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


     if(this.value == "비교값"){ //값 비교


            this.checked = true; //checked 처리


      }


 });


 


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


 


6. checkbox value 값 가져오기 :  $('input:checkbox[id="checkbox_id"]').val(); //단일건


7. checkbox checked 처리 하기 : $('input:checkbox[id="checkbox_id"]').attr("checked", true); //단일건


8. checkbox checked 여부 간단 확인: $("#checkbox_id"]').is(":checked"); //단일건


 


=== Reference ===


* 만약 해당 id, name이 존재하지 않더라도 javascript 에러가 발생하지 않는다.




'개발 > 자바스크립트' 카테고리의 다른 글

[JQUERY] jquery 동적으로 form 생성  (0) 2019.01.25
[JQEURY] select box 선택값 가져오기  (0) 2019.01.23
Comments