다중 선택 목록은 완벽하게 작동한다고 생각합니다. Ctrl 키를 누른 채 마우스를 클릭하면 목록에서 여러 항목을 선택할 수 있습니다. 다음은 일반적인 다중 선택 목록 상자입니다.
위 목록 상자의 코드는 다음과 같습니다.
<form method="get" 액션=""> <b>좋아하는 패스트푸드를 확인하세요:</b><br/> <여러 크기 선택=5 name="즐겨찾기"> <OPTION VALUE="맥도날드">맥도날드</option> <OPTION VALUE="BurgerKing">버거킹</option> <OPTION VALUE="웬디스">웬디스</option> <OPTION VALUE="JackInTheBox">잭 인 더 박스</option> <OPTION VALUE="KFC">KFC</option> <OPTION VALUE="TacoBell">타코벨</option> </SELECT> <br/><input type="submit" value="선택"> </form> |
실제로 페이지에 사용법 안내를 추가하더라도 다중 선택 목록 상자의 사용법을 모르는 사용자가 여전히 있습니다. 또한 각 항목에 추가 제목을 추가하면 정말 도움이 되지만 일반 다중 선택 목록 상자를 사용하면 그 목적을 달성할 수 있을지 확실하지 않습니다.
그러나 일부 CSS와 약간의 JavaScript를 사용하면 더 멋진 다중 선택 목록 상자를 생성하고 일반 다중 선택 목록 상자와 동일한 URL을 만들 수 있다는 것을 알고 있습니다. 이렇게 하면 목록 상자를 처리하는 백엔드 코드를 수정할 필요가 없으며 프런트엔드만 아름답게 하면 됩니다.