지난 번(가기)에 이어 이번엔 간단하게
웹페이지에 있는 모든 체크박스를 모두 체크하고 모두해제하는 간단한 함수를 만들어 보자

$(document).ready(function() {

    $("#ckAll").click(function() {
        if ($("#ckAll:checked").length > 0) {
            $("input:checkbox:not(checked)").attr("checked", "checked");
        } else {
            $("input:checkbox:checked").attr("checked", "");
        }

    });
});

<input type='checkbox' id='ckAll' /><label for='ckAll'>모두체크/해제</label>

위와 같은 체크박스가 있고 아래로 주주룩 체크박스들이 있다고 하자
위의 소스는 #ckAll 체크박스의 click 이벤트를 잡아서 동작한다.

만약에 #ckAll 이 체크되었으면        /
if ($("#ckAll:checked").length > 0) /
모든 체크안된 체크박스를 체크하며 /
$("input:checkbox:not(checked)").attr("checked", "checked"); / (어트리뷰트에 checked='checked'를 추가한다.)
#ckAll 이 체크가 안되어 있으면
모든 체크된 체크박스를 체크해제한다. /
$("input:checkbox:checked").attr("checked", ""); /

이해가 가시죠~..
좋은 하루 되세요^^

jQuery로 checkbox 제어(1)

저작자 표시 비영리 변경 금지
신고

'개발 > 기타' 카테고리의 다른 글

jquery - checkbox 제어하기(3)  (0) 2009.04.24
jquery checkbox 제어하기(2)  (2) 2009.04.21
jQuery로 checkbox 제어(1)  (1) 2009.02.15
JavaScript Playstates Event Code  (0) 2008.12.04
  1. 감사합니다. 2010.09.29 22:42 신고

    야근의 쩔은 육체와 스트레스...
    복사허용으로 코딩까지 덜어 한방에 풀었습니다. 좋은 날 되세요.

  2. 마리 2011.03.15 10:19 신고

    $("input:check:not(checked)") 로는 안되고
    $("input:checkbox:not(checked)") 로 해야 되는데요...

+ Recent posts

티스토리 툴바