1. 양식소개 폼 은 드롭다운 목록 상자, 라디오 버튼, 체크박스, 텍스트 상자 등 다양한 형식을 통해 사용자 데이터를 받는 웹 페이지의 양식 중 하나입니다. 사용된 속성 및 메소드 효과적인 검증을 위한 폼 데이터 획득, 폼 필드에 자동으로 값 할당, 폼 이벤트 처리 등 JavaScript로 폼을 쉽게 조작할 수 있습니다. 이때 각 양식은 객체, 즉 양식 객체로 구문 분석됩니다. 이러한 객체는 document.forms 컬렉션을 통해 참조할 수 있습니다. 예를 들어 form1이라는 속성을 가진 양식은 을 사용할 수 있습니다. 코드 복사 코드는 다음과 같습니다. document.forms["form1"] 그뿐만 아니라 문서의 색인을 통해 양식 개체를 참조할 수도 있습니다. 예를 들어 코드 복사 코드는 다음과 같습니다. document.forms[1] 은 참조 문서 의 두 번째 양식 개체를 나타냅니다. 다음은 여러 양식 요소를 포함하는 양식입니다. 각 요소에는 레이블 태그가 있으며 이러한 방식으로 텍스트를 클릭하여 양식을 설정하고 선택할 수 있으므로 사용자 경험이 향상됩니다. 코드 복사 코드는 다음과 같습니다. 이름을 입력하세요:< ; /p> 비밀번호를 입력하세요:< ; /p> 가장 좋아하는 색상을 선택하세요: 红 녹색 <옵션 값="블루">블루 <옵션 값="노란색">黄 <옵션 값="청록색">青 <옵션 값="보라색">보라색 성별을 선택하세요: male female 무엇을 좋아하시나요: 독서 online sleep 메시지를 남기고 싶습니다: 일반적으로 각 양식 요소에는 name 및 id 속성이 있어야 하며, name은 이를 서버에 전달하는 데 사용되고, id는 바인딩 및 기능 필터링에 사용됩니다. 2. 형식의 요소에 액세스합니다. 텍스트 상자, 라디오 버튼, 드롭다운 버튼, 드롭다운 목록 상자 또는 기타 콘텐츠 등 양식의 요소는 양식의 요소 컬렉션에 포함됩니다. 컬렉션 또는 요소의 이름 속성을 사용하여 이 요소에 대한 참조를 가져옵니다. 코드 복사 코드는 다음과 같습니다. var oForm = document.forms["form1"]//양식 가져오기 var otextForm = oForm.elements[0] //첫 번째 요소 가져오기 var otextPasswd = oForm.elements["passwd"] //이름 속성이 passwd인 요소 가져오기 가장 효과적이고 직관적인 방법으로 인용하세요: 코드 복사 코드는 다음과 같습니다. var otextcomments = oForm.elements.comments; 설명 요소인 name 속성 3. 공용 속성 및 메서드 양식의 모든 요소(숨겨진 요소 제외)에는 몇 가지 공통 속성과 메서드가 있습니다. 다음은 일반적으로 사용되는 몇 가지 사항입니다 코드 복사 코드는 다음과 같습니다. var oForm = document.forms["form1"] //양식 가져오기 var otextcomments = oForm.elements.comments //이름 속성이 주석인 요소 가져오기 Alert(oForm.type) //요소 유형 보기 var otextPasswd = oForm.elements["passwd"] //이름 속성이 passwd인 요소 가져오기 otextPasswd.focus(); //특정 요소에 포커스 4. 양식 제출 폼 제출은 버튼 기능이 있는 버튼이나 이미지를 통해 완료 코드 복사 코드는 다음과 같습니다. 사용자가 Enter 키를 누르거나 버튼 중 하나를 클릭하면 추가 코드 없이 양식 제출을 완료할 수 있습니다. 양식의 action 속성을 통해 제출 여부를 확인할 수 있습니다. 코드 복사 코드는 다음과 같습니다. 양식을 제출하는 동안 네트워크 속도가 느려서 사용자가 제출 버튼을 반복적으로 클릭할 수 있는데, 이는 서버에 큰 부담이 됩니다. 이 동작은 비활성화된 속성을 사용하여 금지할 수 있습니다. 예: 코드 복사 코드는 다음과 같습니다. ;
