input의 type

input에는 굉장히 다양한 유형이 있습니다. 또한 이러한 유형에 따라 생긴 모양도 다르며 유형에 따라 사용하지 못하는 속성도 있습니다.

<input> 태그의 type 속성은 <input> 요소가 나타낼 타입을 명시합니다.

1. submit타입

<input type="submit">

코드 안에 제출이라는 단어를 쓰지 않았음에도 제출이라는 버튼이 화면에 출력됩니다. 이 버튼을 누르면 submit이 되게 됩니다. 이는 기본 값이 제출로 되어 있기 때문이며 value=""을 통해 다른 값으로 변경이 가능합니다.

2. button타입

<input type="button">

button타입을 사용하면 버튼이 생기지만 submit타입과 다르게 다른 변화가 없습니다.

3. reset타입

<input type="reset">

제출이랑 마찬가지로 자동으로 초기화라는 문구가 들어간 버튼이 생깁니다. 또한 이 버튼을 누르면 폼내의 정보가 초기화 됩니다.

4. checkbox타입

    <input type="checkbox" name="check1">
    <input type="checkbox" name="check2" checked>
    <input type="checkbox" name="check3">

checked를 이용해 기본 값이 체크된 상태로 출력할 수 있습니다.

5. radio타입

    <input type="radio" name="check">
    <input type="radio" name="check" checked>
    <input type="radio" name="check">

name을 같은 값으로 만드는 경우 한가지 값만 선택을 할 수 있습니다. 마찬가지로 checked를 이용해 기본 값이 체크된 상태로 출력할 수 있습니다.