양식은 웹페이지와 사용자 간의 상호작용 도구로, 요소에서 사용할 수 있는 다른 태그를 포함하는 컨테이너로 구성됩니다. 양식에는 , , , <fieldset>, <legend>, <label> 및 기타 양식 제어 요소가 포함될 수 있습니다. <span style="line-height: 1.76em;">양식 요소란 무엇인가요? <strong>다음 요소가 포함되어 있습니다: <form>, <input> 입력 텍스트 상자, <button> 버튼, <option> 정의 드롭다운 메뉴, <select>, <textarea> 텍스트 영역 등. , 물론 html5에는 몇 가지 새로운 요소가 추가되었습니다. 다음 콘텐츠 에는 다양한 HTML 양식 요소 획득 및 사용 예가 요약되어 있습니다! 1. HTML5의 새로운 양식 요소 및 사용 예시 1 HTML5의 새로운 양식 요소 사용 방법 요약 및 예시 튜토리얼 HTML5 새 양식 요소 : 태그는 옵션 목록을 정의합니다. 이 요소를 입력 요소와 함께 사용하여 가능한 입력 값을 정의합니다. : 태그는 양식에 사용할 키 쌍 생성기 필드를 지정합니다. : 태그는 스크립트 출력과 같은 다양한 유형의 출력을 정의합니다. 2.HTML 양식 양식 요소에 대한 포괄적인 이해 datalist 요소는 입력 필드에 대한 옵션 목록을 지정합니다. 데이터 목록 내 옵션 요소를 통해 목록이 생성됩니다. 데이터 목록을 입력 필드에 바인딩해야 하는 경우 입력 필드의 목록 속성을 사용하여 데이터 목록의 ID를 참조하세요. keygen 요소는 키 쌍 생성기입니다. 양식이 제출되면 두 개의 키가 생성됩니다. 하나는 개인 키이고 다른 하나는 공개 키입니다. 개인 키는 클라이언트에 저장되고 공개 키는 서버로 전송됩니다. 출력 요소는 계산 또는 스크립트 출력과 같은 다양한 유형의 출력에 사용됩니다. 2. PHP1의 양식 요소에 대한 자세한 설명 PHP 양식 요소 소개: 선택 필드 태그 및 텍스트 필드 태그 By 선택 도메인 tag 및 을 사용하면 목록이나 메뉴를 만들 수 있습니다. 메뉴는 공간을 절약하기 위해 사용됩니다. 일반적인 조건에서는 메뉴의 한 가지 옵션만 볼 수 있으며, 오른쪽 하단의 삼각형 버튼을 클릭하여 메뉴를 열어야만 모든 옵션을 볼 수 있습니다. 목록에는 특정 개수의 옵션이 표시될 수 있습니다. 이 숫자를 초과하면 스크롤 막대가 자동으로 나타나며 시청자는 스크롤 막대를 드래그하여 각 옵션을 볼 수 있습니다. 2. PHP 양식 요소 소개: 입력 필드 태그 입력 필드 태그 는 양식에서 가장 일반적으로 사용되는 태그 중 하나입니다. 일반적으로 사용되는 입력 필드 태그에는 텍스트 상자, 버튼, 라디오 버튼, 체크 상자 등이 포함됩니다. 3.PHP 처리 예 체크박스 다중 선택 상자 양식 요소체크박스 값 획득 방식은 일반적인 입력 획득 방식과 다릅니다. 체크박스에 배열 형태로 통일된 이름을 부여해야 합니다. as mycheckbox[], yes PHP에서 배열을 정의하는 방법입니다. 그런 다음 POST 형식의 $_POST['mycheckbox']와 같이 이 데이터를 백그라운드에서 가져옵니다. 이때 데이터는 이미 배열입니다. 3. 양식 요소를 가져오고 사용하는 JavaScript 및 jquery1. javascript 양식 요소를 가져오는 여러 가지 방법첫 번째 방법은 요소 이름을 통해 가져오는 것입니다두 번째 방법 : 요소의 인덱스를 가져옵니다세 번째 방법: 요소의 ID를 통해 가져옵니다2. 양식 요소 처리를 위한 jQuery 코드 1) 입력 클래스 값 가져오기: $("input").val(); 2) 텍스트 영역 클래스 값 가져오기: $("textarea").val(); ) 선택 클래스 값 가져오기: $("select").val(); 양식에 여러 입력 클래스(또는 텍스트 영역 클래스 및 선택 클래스)가 포함된 경우 위 방법을 사용하여 얻은 결과는 배열이 됩니다. 물론 이러한 컨트롤에 ID를 추가하여 특정 컨트롤의 값을 가져올 수 있습니다(예: $("input#myID").val()). 양식 요소 관련 질문과 답변: 1. 프런트엔드 - 모바일 측에서 양식 요소 클릭 시 페이지의 상대적 이동에 문제가 있나요? 2. javascript - React3에서 React-bootstrap 양식 요소 제어의 내부 값을 얻는 방법javascript【관련 권장 사항】 1. php.cn 원본 html5 비디오 튜토리얼2. "php.cn Dugu Jiujian (4)-php 비디오 튜토리얼"3. php.cn Dugu Jiujian (3)-JavaScript 비디오 튜토리얼
