체크박스 input[type="checkbox"] 전체 체크 구현

 

 

이벤트 리스너를 등록해 전체 체크의 값이 변하면 나머지도 같이 바꿔준다 

checkAll.addEventListener('change', function () {
			check1.checked = checkAll.checked;
			check2.checked = checkAll.checked;
			check3.checked = checkAll.checked;
		});

 

전체 체크 이외의 체크박스 값이 변하는걸 감지해서 전체가 true가 아닐경우 <전체체크>가 해제 되도록 한다 

check.addEventListener('change', function () {
				if (check1.checked && check2.checked && check3.checked) {
					checkAll.checked = true;
				} else {
					checkAll.checked = false;
				}
			});

 

 

 

 

[CSS/CSS 응용] - input[type='checkbox'] 로 toggle 버튼 switch 버튼 만들기

[javascript/javascript] - [javascript]체크박스(input[type="checkbox"]) 제어하기

[CSS/CSS 기초] - [CSS]input[type=radio], input[type=checkbox] 스타일 적용 및 checked 선택자 이용하기