라디오 버튼
라디오 버튼은 HTML 폼 요소로, 원형 버튼 모양이며 선택되거나 선택 해제될 수 있습니다.
라디오 버튼은 input 태그와
type 속성 값을 radio로 설정하여 생성합니다.
모양:
단일 라디오 버튼은 거의 사용되지 않으며,
그룹으로 사용해야 합니다. 그룹 내에서는
하나의 버튼만 선택할 수 있습니다. 버튼들이
name 속성 값이 동일할 때만
그룹을 형성합니다 (아래 예제 참조).
예제
두 개의 라디오 버튼을 만들어 봅시다:
첫 번째는 선택된 상태로 (checked 속성 설정),
두 번째는 선택되지 않은 상태로. 이 버튼들은
하나의 그룹을 이루며, 그룹 내에서는
하나만 선택될 수 있습니다 (name 속성 값이 동일하기 때문).
라디오 버튼에 서로 다른 value 속성 값을
부여한 것에 주목하세요. 이는 폼 데이터가 서버로 전송된 후,
PHP가 어떤 버튼이 선택되었는지 식별할 수 있게 하기 위함입니다:
<input type="radio" name="test" checked value="1">
<input type="radio" name="test" value="2">
:
예제
이제 두 그룹의 라디오 버튼을 만들어 봅시다:
첫 번째 그룹은 하나의 name 속성 값을 가지고,
두 번째 그룹은 다른 값을 가집니다. 버튼들을 클릭해 보면,
각 그룹이 독립적으로 동작하는 것을 확인할 수 있습니다:
<input type="radio" name="radio1" checked>
<input type="radio" name="radio1">
<input type="radio" name="radio1">
<br>
<input type="radio" name="radio2" checked>
<input type="radio" name="radio2">
<input type="radio" name="radio2">
:
