체크박스에 대해서...
셀렉트박스(select)와 라디오버튼(type="radio")의 엘리먼트들은 값을 한가지만 선택할 수 있는 반면에 체크박스는 여러개의 값을 선택할 수 있는 특징을 가지고 있습니다.
기본적인 체크박스의 형태는 다음과 같습니다.
<form method="POST" action="/regist"> <input type="checkbox" name="chk_info" id="checkinfo1" value="value1"> <label for="checkinfo1">value1</label> <input type="checkbox" name="chk_info" id="checkinfo2" value="value2"> <label for="checkinfo2">value2</label> <input type="checkbox" name="chk_info" id="checkinfo3" value="value3"> <label for="checkinfo3">value3</label> </form>
그 중에 값이 check되어 있는 상태로 작성하고 싶으면 checked 속성을 사용합니다.
사용 예제는 아래와 같습니다.
<form method="POST" action="/regist"> <input type="checkbox" name="chk_info" id="checkinfo1" value="value1" checked="checked"> <label for="checkinfo1">value1</label> <input type="checkbox" name="chk_info" id="checkinfo2" value="value2"> <label for="checkinfo2">value2</label> <input type="checkbox" name="chk_info" id="checkinfo3" value="value3" checked> <label for="checkinfo3">value3</label> </form>
데이터가 전송될 때는 같은 name의 데이터가 사용되므로
위의 예제같은 경우에는
chk_info = "value1, value3"
이렇게 한개의 Key에 두개의 값이 , (콤마)로 구분되어 서버에 전송됩니다.
'HTML+CSS+자바스크립트' 카테고리의 다른 글
| 자바스크립트 URL 인코딩 (0) | 2017.11.28 |
|---|---|
| 자바스크립트를 이용한 체크박스 컨트롤 (0) | 2017.11.27 |
| HTML에서 특수문자 사용하기 (0) | 2017.11.23 |
| 배열(array)이 이용하는 함수 (0) | 2017.11.21 |
| favicon 만들어 적용하기. (0) | 2017.11.19 |