이전 포스팅에서 SelectBox를 제어하는 방법에 대해 포스팅 하였는데, 이번에는 Checkbox를 제어해 보자.
Checkbox는 selectBox에 비해 내용이 몇개 없으므로 간단하게 설명하겠다.
1. 체크여부 확인
- id가 동일한 체크박스에 대하여 선택되어 있는지 확인 : true / false 반환
$("#chkBox").is(":checked") ;
$("input:checkbox[id='chkBox']").is(":checked") ;
* 1.6이상일때 권장 사용법
$("#chkBox").prop("checked") ;
2. 체크박스 갯수 가져오기
- 선택된 체크박스 갯수 구하기
$("#chkBox:checked").length ;
- 전체 체크박스 갯수 구하기
$("#chkBox").length ;
3. 체크박스 전체 선택하기 / 해제하기
- 전체 선택하기
$("#chkBox").prop('checked', true) ;
$("#chkBox").attr('checked', true) ;
- 전체 해제하기
$("#chkBox").prop('checked', false) ;
$("#chkBox").attr('checked', false) ;
4. 체크된 체크박스 value 가져오기
$('#chkBox:checked').each(function() {
alert($(this).val());
});
5. 체크박스 클릭시 이벤트 주기
function msgAlert(){
alert('1');
}
$("#chkBox" ).on( "click", msgAlert());
'Language > JQuery' 카테고리의 다른 글
[jQuery] 문자열 앞뒤 공백제거 - $.trim() (0) | 2015.01.06 |
---|---|
Keyboard Event Code 모음 (event.keyCode) (0) | 2014.12.24 |
[jQuery] radio button 제어, 사용법 (0) | 2014.12.22 |
[jQuery] SelectBox 제어, 사용법 (0) | 2014.12.18 |
[jQuery] class 추가,삭제,존재여부 확인 - addClass, removeClass, hasClass (0) | 2014.12.05 |