Gegründet 2006

radio button 예제

아래 와 같이 구식 라디오의 푸시 버튼과 유사한 방식으로 보고 작동하기 때문에 라디오 버튼이라고 합니다. 이것은 자바 스크립트를 사용하여 라디오 버튼으로 작업하는 방법의 간단한 예일 뿐입니다. 특히 jQuery와 같은 JavaScript 프레임워크를 사용하면 DOM 요소를 선택하고 조작하기가 훨씬 쉬워집니다. 라디오 단추는 사용자가 항목 그룹에서 하나만 선택해야 하는 경우에 사용됩니다. for 특성은 사용자 지정 라디오 단추를 입력과 바인딩하는 데 필요합니다. 입력 ID를 레이블의 for 특성 값으로 추가합니다. 참고: 확인된 특성을 두 개 이상의 라디오 단추에 넣으면 이후 인스턴스가 이전 속성을 재정의합니다. 즉, 마지막으로 확인된 라디오 단추가 선택된 버튼이 됩니다. 이는 그룹의 라디오 단추 하나만 한 번에 선택할 수 있으며 사용자 에이전트는 새 단추를 선택된 것으로 표시할 때마다 자동으로 다른 단추를 선택 해제하기 때문입니다.

어쨌든, 사용자는 라디오 버튼 의 우리의 그룹에서 하나의 선택을 할 수 있기 때문에, 그 그룹의 모든 라디오 버튼은 같은 이름을 공유해야합니다. 이것은 우리가 목록을 함께 그룹화하는 방법입니다 – 그들은 모두 같은 이름을 공유합니다. 이렇게 하면 폼 처리기에게 그룹의 이름과 선택한 라디오 단추의 값이 표시됩니다. 다음은 라디오 단추의 두 그룹입니다. 각 그룹의 라디오 버튼이 이름을 공유한다는 것을 다시 한 번 알 수 있습니다. 첫 번째 그룹에는 „preferred_color“의 이름이 있고 두 번째 그룹에는 „preferred_item“의 이름이 있습니다. 다음 예제에서는 문서 전체에서 본 예제의 약간 더 철저한 버전과 몇 가지 추가 스타일 및 특수 요소를 사용하여 설정된 더 나은 의미 체계를 보여 주어집니다. HTML은 다음과 같습니다: 라디오 버튼을 사용하면 사용자가 제한된 수의 선택 항목 중 하나만 선택할 수 있습니다. 예를 들어 양식에서 사용자에게 기본 연락처 방법을 요청해야 하는 경우 각각 세 개의 라디오 단추를 만들 수 있습니다. 사용자는 값을 표시할 코드를 명시적으로 추가하지 않는 한 값이나 이름을 볼 수 없습니다. `라디오 단추`는 사용자가 여러 옵션 중에서 단일 선택을 할 수 있도록 하는 데 사용되는 구성 요소입니다(확인란은 여러 옵션을 선택하는 데 사용됩니다).

라디오 단추는 사용자에게 두 개 이상의 옵션 중에서 선택할 수 있도록 할 때마다 사용해야 합니다. 그들은 확인란처럼 많이 보이지만 옵션 그룹 내에서 0 또는 여러 선택을 허용하는 대신 라디오 버튼을 사용하여 하나만 선택해야합니다. 가장 간단한 형태로 라디오 단추는 단순히 입력 요소와 같은 형식 속성이 라디오로 설정되어 있습니다: 양식은 이전 예제와 거의 동일하지만 양식의 onsubmit 이벤트에 대한 이벤트 처리기를 추가한 방법을 알 수 있습니다. 그것은 내가 예제의 하단부분에 정의 한 자바 스크립트 기능을 참조 – 모든 애완 동물 선택 라디오 버튼을 통해 루프하고 체크 된 속성이 사실 인 하나에 도달하면 즉시, 그것은 확인을 위해 사용자에게 요청합니다.

Comments are closed.