HTML input 태그의 type

유저에 의해서 어떤 것들을 선택할지, 하나를 선택할지 여러개를 선택할지에 대한 고민중 input태그의 type에 대해 공부해보았다.

1.checkbox

• 우선 체크박스는 사용자가 선택할 수 있는 여러 옵션들 중에서 하나 이상을 선택할 수 있을 때 적합하다.
• 체크박스는 독립적이며 각각의 체크박스들은 개별적으로 선택되거나 선택할 수 있다.
• 기본상태는 선택 / 해제 이다.

예시

 <input type='checkbox' id='option1' name='options' value='1' />
  <input type='checkbox' id='option2' name='options' value='2' />
   <input type='checkbox' id='option3' name='options' value='3' />

2.Radio

• 라디오버튼은 체크박스와 반대로 여러개의 옵션들중 하나만 선택 할 수 있게 한다.(같은 그룹내에서)
• 예를 들면 항목중 필수로 선택해야하는 것들.. 이런 곳에서 사용하기에 적합

예시

<input type='radio' id='option1' name='options' value='1' />
  <input type='radio' id='option2' name='options' value='2' />
   <input type='radio' id='option3' name='options' value='3' />

그 외의 타입들

그 외의 타입들에는 type쪽에서 일반적으로는
text를 사용하고 비밀번호를 관리하는 input태그라면 password를 하고
file을 관리하는곳이라면 type='file' 도 있다. 여러가지의 타입들이 있으니 필요할 때 검색을 통해 구현하면 좋을 껏 같다.

내가 진행하고 있는 사이트프로젝트의 필요성으로 인해 공부한 결과

checkbox는 여려개의 옵션들중 하나 이상을 선택 할 수 있을때 적합 (옵션 선택적)
radio는 여러개의 옵션들중 하나만 선택 할 수 있을 때 적합 (옵션 선택필수)