<select></select> 태그는 클릭하면 메뉴가 나타나 선택하는 박스이다.

기본적으로 값을 선택하기 위해선 중간에 <option>이 필요하며 <option>의 value 값으로 <select> 변수 값이 정해진다.

<select>는 기본적으로 날짜중에 월이나 일만 선택하거나, 나이, 휴대폰 번호 앞자리 선택 등
다양한 곳에서 사용된다.

<select> 박스에서 value 값을 한글로 줘도 되지만 되도록이면 영어로 주도록한다.

<select name="select_box" id="select_box" onChange="change_event(this.value);"> 
<option value="number_1_data">첫번째 데이터</option> 
<option value="number_2_data">두번째 데이터</option> 
<option value="number_3_data">세번째 데이터</option> 
<option value="number_4_data">네번째 데이터</option> 
</select>

예시 페이지에서 가져온 <select>박스문의 기본이다.

<select>박스에서는 주로 onChange 이벤트를 많이 사용한다.
<option>이 변경되었을 경우 스크립트를 실행해준다는 내용이다.

this.value 일 경우 현재 <select> 박스가 선택한 <option>의 value 값을 가져간다는 뜻이다.
좀 더 정확한건 예시 페이지에서 보도록 하겠다.

http://hyoseung930.cafe24.com/bolg_poster/select_test_page.php

'WEB > HTML' 카테고리의 다른 글

[HTML] 모바일 확대 방지  (0) 2017.11.29
[HTML] <table> 태그  (0) 2017.11.27
[HTML] <form> 태그  (0) 2017.11.27
[HTML] <input> 태그의 type 속성  (0) 2017.11.27
[HTML] <span> 태그  (0) 2017.11.27

+ Recent posts