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());
- 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());
출처: http://fruitdev.tistory.com/143?category=568934 [과일가게 개발자]
'JSP > javascript jQuery' 카테고리의 다른 글
[자바스크립트] 문자열 처리 함수 (0) | 2019.11.12 |
---|---|
[jQuery] AJAX 사용 방법 (0) | 2019.10.28 |
[jQuery] radio button 제어, 사용법 (0) | 2018.10.23 |
[JSP] 페이지 로드 스크립트 순서 (0) | 2018.08.26 |
[jQuery] 동적으로 table(html tag) 추가/삭제 및 유효성 체크 (0) | 2018.08.07 |