select 태그
select 태그는 HTML 폼에서 사용할
드롭다운 목록을 생성합니다.
목록의 개별 항목은
option 태그 안에 있어야 합니다.
속성
| 속성 | 설명 |
|---|---|
multiple |
이 속성이 있으면 멀티셀렉트가 생성됩니다 -
Ctrl 키를 누르거나 마우스로 여러 항목을 선택할 수 있는 드롭다운 목록입니다.
선택적 속성입니다. |
name |
드롭다운 목록의 이름입니다. PHP에서 입력 필드의 데이터를 가져오기 위해 필요합니다. 폼이 올바르게 작동하려면 입력 필드의 이름이 서로 달라야 합니다 (동일한 폼 내에서). 이름이 같은 경우 PHP에는 HTML 코드에서 더 아래에 있는 입력 필드의 데이터가 전송됩니다. |
예제
드롭다운 목록이 어떻게 작동하는지 살펴보겠습니다:
<select>
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
예제
드롭다운 목록의 너비를 가장 큰 요소의 너비와 같게 만들어 보겠습니다 (width CSS 속성으로 명시적으로 지정되지 않은 경우):
<select>
<option>Big City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
예제 . 기본 선택
이제 기본값으로 도시를 선택해 보겠습니다. selected 속성을 사용하여 이 작업을 수행합니다:
<select>
<option>Big City1</option>
<option selected>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
예제 . 멀티셀렉트
이제 multiple 속성을 사용하여 일반 셀렉트를 멀티셀렉트로 변환해 보겠습니다:
<select multiple name="city[]">
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
:
name 속성에 지정된 셀렉트 이름 끝에 대괄호가 있어야 한다는 점에 유의하세요. 이는 PHP에서 선택된 모든 값이 전송되도록 하기 위해 필요합니다 (그렇지 않으면 하나만 전송됩니다 - 마지막 값).
예제 . 멀티셀렉트의 여러 기본값
이제 멀티셀렉트에서 기본값으로 하나 이상의 값을 선택해 보겠습니다:
<select multiple name="city[]">
<option>City1</option>
<option selected>City2</option>
<option>City3</option>
<option selected>City4</option>
</select>
: