[jQuery] 입력 요소의 제어 - 체크 박스(Checkbox)

반응형

체크여부 확인

id가 동일한 체크박스에 대하여 선택되어 있는지 확인 : true / false 반환

$("#chkBox").is(":checked");
$("input:checkbox[id='chkBox']").is(":checked");

1.6이상일 때, 권장 사용법

$("#chkBox").prop("checked");

체크박스 갯수 가져오기

선택된 체크박스 갯수 구하기

$("#chkBox:checked").length;

전체 체크박스 갯수 구하기

$("#chkBox").length;

체크박스 전체 선택하기 / 해제하기

전체 선택하기

$("#chkBox").prop('checked', true);
$("#chkBox").attr('checked', true);

전체 해제하기

$("#chkBox").prop('checked', false);
$("#chkBox").attr('checked', false);

체크된 체크박스 value 가져오기

$('#chkBox:checked').each(function() { 
    alert($(this).val());
});

체크박스 클릭시 이벤트 주기

$("#chkBox").on("click", function() {
    alert('1');
});

반응형

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

'jQuery' 카테고리의 다른 글

[jQuery] 이펙트(effect) 효과 - 페이드 효과 .fadeIn() .fadeOut() .fadeToggle()  (0)	2018.12.04
[jQuery] 이펙트(effect) 효과 - 요소의 표시와 숨김 .hide() .show() .toggle()  (0)	2018.12.04
[jQuery] 입력 요소의 제어 - 체크 박스(Checkbox)  (0)	2018.11.29
[jQuery] 입력 요소의 제어 - 선택 박스(Select box)  (0)	2018.11.29
[jQuery] 입력 요소의 제어 - 라디오 버튼(Radio button)  (0)	2018.11.29
[jQuery] 이벤트 처리 - 이벤트 메소드 .click() .hover() .keypress() .focusin()  (0)	2018.11.29