콤보박스라고도 하며 Pull-Down Menus라고 표현하기도 합니다.
<select name="job">
<option value="">직업선택</option>
<option value="학생">학생</option>
<option value="회사원">회사원</option>
<option value="기타">기타</option>
</select> |
<select>태그와 <option>태그로 구성됩니다.
<option> 태그에서 사용하는 value 속성은 텍스트 필드에서의 value 속성과는 조금 틀립니다. 텍스트 필드에서 value 속성에 값을 입력하면 기본값이 입력되지만 <option> 태그의 경우는 이 <option>이 선택된 경우 전송되는 값을 지정하는 것입니다.
위의 예제에서 학생을 선택된채로 폼을 전송했다면 job 필드의 value값은 <option value="학생">의 value값인 "학생"으로 지정됩니다.
기본값으로 회사원이 선택되게 할려면 selected 속성을 사용해야 합니다.
<select name="job">
<option value="">직업선택</option>
<option value="학생">학생</option>
<option value="회사원" selected="selected">회사원</option>
<option value="기타">기타</option>
</select> |
아래와 같이 회사원이 선택된채로 출력됩니다.
<optgroup>은 HTML 4 버전에서 새로 만들어진 태그로 옵션에 카테고리를 만들 수 있습니다. 대부분의 웹브라우저에서 지원하고 있다.
<select name="hobby">
<option value="독서">독서</option>
<optgroup label="스포츠">
<option value="야구">야구</option>
<option value="축구">축구</option>
</optgroup>
<option value="음악감상">음악감상</option>
</select> |
스포츠라는 카테고리를 만들고 야구와 축구 옵션을 추가하였습니다.
