jQuery 체크박스(checkbox) 전체선택, 해제 예제

체크박스 예외처리에 이어 전체선택, 해제 예제 포스팅

다음과 같이 jsp파일에 체크박스 하나 추가 후 id 부여한다.
이후 다음과 같이 Script 코드 작성

$("#checkAll").click(function(){ // 전체 선택 버튼 클릭시
			var checked = $(this).prop("checked");
		
			if(checked){
				$(":checkbox[name=checkbox]").prop("checked", true);
			} else {
				$(":checkbox[name=checkbox]").prop("checked", false);
			}
		});

prop은 property의 약자로 속성을 의미하고, 태그의 attr 값들의 getter / setter 역할을 수행한다.
다음과 같이 checked 변수에 해당 태그의 checked 속성값을 저장한 후 체크여부에 따라 같은 name 속성을 가지고 있는 태그들의 checked 속성을 true 또는 false로 일괄변경한다.
※ :checkbox 는 체크박스 셀렉터로 이전 포스팅의 설명 참조
http://blog.naver.com/p952973/220975801007

모두 선택 앞의 체크박스를 클릭하면 나머지 사진들도 체크가 되고 사라진다.