체크박스 예제
확인란은 목록에서 하나 또는 여러 옵션을 선택하는 데 사용되며 라디오(옵션) 단추는 여러 옵션 중에서 하나의 옵션을 선택하는 데 사용됩니다. 이 예제에서는 확인란을 선택 하 고 폼을 서버에 제출 하는 경우 서버 양식 요소 “nameOfChoice”를 읽을 수 있을 것입니다 및 해당 값 1 됩니다. 예를 들어 다음 데모에서는 사용자가 관심사를 선택할 수 있도록 여러 확인란을 포함합니다(예제 섹션의 전체 버전 참조). 예를 들어 FTP를 통해 보낼 파일을 선택하기 위해 표시되는 확인란에서 트리 보기를 사용하여 파일을 한 번에 하나씩 또는 폴더별로 선택할 수 있습니다. 폴더에 있는 파일 중 일부만 선택하면 해당 폴더의 확인란이 확정되지 않습니다. 이 확정되지 않은 확인란을 클릭하면 포함 된 파일이 모두 선택되지 않거나 덜 일반적으로 포함 된 파일이 선택되지 않습니다. 확인란을 계속 클릭하면 선택된(모든 하위 디렉토리 및 선택한 파일)과 선택되지 않은 파일(선택한 하위 디렉토리 또는 파일 없음)이 번갈아 가며 표시됩니다. 이것은 아래 예제에서 볼 수 있습니다 (영감CSS 트릭 덕분에). 이 예제에서는 레시피를 위해 수집하는 재료를 추적합니다.
성분의 확인란을 선택하거나 선택을 취소하면 JavaScript 함수가 확인된 재료의 총 수를 확인합니다. 확인란은 이에 적합하지만 언급했듯이 사용자에게 가능한 옵션을 선택할 수 있도록 하는 데도 사용할 수 있습니다. 다른 DOM 요소와 마찬가지로 JavaScript를 사용하여 확인란을 조작 할 수 있습니다. 이와 관련하여 확인란을 선택했는지 여부를 확인하고 사용자가 선택할 수 있는 옵션 수를 제어하는 몇 가지 논리를 추가하는 것이 흥미로울 수 있습니다. 이 작업을 수행하는 방법을 보여 드리기 위해 이전 예제 (“즐겨 찾기 애완 동물”선택기)를 확장하여 JavaScript 마법을 포함했습니다 : 웹 페이지에 확인란을 만들려면 아래와 같이 태그를 사용합니다. 아래 예제에서는 확인란을 만들고 “확인란 1” 텍스트 다음에 오는 확인란의 위의 예에서 코드를 사용하고 있습니다. 그러나 모든 입력 요소와 마찬가지로 이름을 사용할 수 있도록 이름을 정의해야 합니다. 또한 값을 설정하려고 합니다 – 확인란을 선택한 경우 서버로 전송되는 값입니다. 다음은 위의 예에서 연관된
이것은 특히 스마트 폰과 같은 작은 화면 장치에서 원하는 옵션을 쉽게 클릭 할 수있는 HTML 양식 레이블의 정말 유용한 기능입니다.
記事を見てくれてありがとうございます!