HTML 드롭다운 목록 상자는 웹 페이지에서 일반적으로 사용되는 대화형 요소 중 하나이며, 이를 통해 사용자는 하나 이상의 미리 정의된 옵션을 선택할 수 있습니다. 이 문서에서는 드롭다운 목록 상자 만들기, 옵션 추가, 기본 옵션 설정 등을 포함하여 HTML 드롭다운 목록 상자를 설정하는 방법을 소개합니다.
1. 드롭다운 목록 상자 만들기
HTML 드롭다운 목록 상자를 사용하는 첫 번째 단계는 아래와 같이
<select name="fruit"> </select>
이 코드는 드롭다운 목록을 만듭니다. "과일"이라는 상자가 있지만 아직 옵션이 없습니다.
2. 옵션 추가
다음으로
3. 기본 옵션 설정
기본적으로 드롭다운 목록 상자의 첫 번째 옵션이 선택됩니다. 다른 옵션을 기본 옵션으로 설정하려면 아래와 같이
<select name="fruit"> <option value="apple">苹果</option> <option value="banana">香蕉</option> <option value="orange">橙子</option> </select>
이 예에서는 "Banana" 옵션이 기본 옵션으로 설정되어 있습니다.
4. 다중 선택 설정
사용자가 여러 옵션을 선택하도록 하려면 아래와 같이
<select name="fruit"> <option value="apple">苹果</option> <option value="banana" selected>香蕉</option> <option value="orange">橙子</option> </select>
사용자가 "Ctrl"을 누른 상태에서 키를 누르고 옵션을 클릭하면 여러 옵션을 선택할 수 있습니다. 서버는 여러 옵션에 대한 값을 받을 수 있습니다.
5. 양식 제출 설정
사용자가 하나 이상의 옵션을 선택한 후 해당 옵션의 값을 서버에 제출해야 합니다. 이렇게 하려면 아래와 같이
<select name="fruit" multiple> <option value="apple">苹果</option> <option value="banana" selected>香蕉</option> <option value="orange">橙子</option> </select>
이 예에서는 양식의 다른 요소 표시되지는 않지만 더 복잡한 기능을 활성화하기 위해 유사한 방식으로 양식에 추가할 수 있습니다.
일반적으로 HTML 드롭다운 목록 상자는 웹 페이지에서 일반적으로 사용되는 대화형 요소 중 하나입니다. 생성, 옵션 추가, 기본 옵션 설정, 다중 선택 설정 및 양식 제출 설정 방법을 이해한 후 원하는 대로 수행할 수 있습니다. 사용자가 편리하게 선택할 수 있도록 드롭다운 목록 상자를 사용자 정의해야 합니다.
위 내용은 HTML 드롭다운 목록 상자를 설정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
