[javascript]checkbox 특정 개수 필수 선택

checkbox 특정 개수 필수 선택

---

input 태그 중 checkbox 타입은 한 개 이상의 선택이 필요할 때 사용합니다

프로젝트 진행중 체크박스 중 필수로 특정 개수만큼 선택해달라는 요구사항이 있었고

그로 인해 간단하게 만들었던 함수입니다.

 

 

 

기본 동작

---

기본적인 기능 은 radio 타입과 비슷하게 만들었고 그로 인해 다중 선택 가능한 radio 태그로도 생각할 수 있습니다.
※ 1개를 필수 개수로 입력 시 radio타입과 동일하게 동작

1. 특정 개수만큼 기본적으로 체크

2. 추가 선택 시 제일 처음 체크한 태그 체크해제

3. 체크 해제 방지

 

 

소스 코드

---

체크할 개수를 입력하고 설정버튼을 누르시면 동작합니다.

See the Pen checkboxLikeRadio by kjg20260 (@kjg20260) on CodePen.

 

※ 간단한 코드이므로 조금만 수정하면 필수 몇 개 선택(n)이 아닌 최대 몇 개까지(1~n) 선택도 가능합니다.