JS의 form.submit()이 양식을 제출할 수 없는 이유

이 글에서는 JS의 form.submit()이 폼을 제출할 수 없는 오류 이유를 주로 소개합니다. 이 글의 마지막 결론은 도움이 필요한 친구가 참조할 수 있는 버튼의 ID와 이름에 submit을 사용하면 안 된다는 것입니다. to it

코드로 바로 이동:

<p id="register">
     <h4 id="会员注册">会员注册</h4>
     <p class="formp">
         <form method="post" action="register.php?action=register" name="register" id="registerForm">
             <dl>
                 <dt>请认真填写以下内容</dt>
                 <dd class="hasspan">
                     用户名：<input type="text" name="username">
                 </dd>
                 <dd class="hasspan">
                     密码：<input type="password" name="pwd">
                 </dd>
                 <dd class="hasspan">
                     确认密码：<input type="password" name="pwdagain">
                 </dd>
                 <dd id="tximg">
                     <img src="/static/imghwm/default1.png"  data-src="img/face/m01.gif"  class="lazy"   alt="选择头像" id="faceimg">
                     <input type="hidden" name="touxiang" value="">
                     <label id="imgsrclabel">m01.gif</label>
                 </dd>
                 <dd style="margin-right:120px;">
                     验证码：<input type="text" name="code">
                     <span>
                         <img src="/static/imghwm/default1.png"  data-src="code.php"  class="lazy"   alt="code" id="code" name="code">
                         <a href="#code" id="change">换一张</a>
                     </span>
                 </dd>
                 <dd class="btns">
                     <input type="button" name="submit" id="submit" value="注册">
                     <input type="button" name="quit" id="quit" value="退出">
                 </dd>
             </dl>
         </form>
     </p>
 </p>

이 페이지에 양식 데이터를 제출하면 다음과 같이 js 처리

/*注册表单提交*/
 function formDeal()
 {
     var btnSubmit = document.getElementById('submit');
     var formId = document.getElementById('registerForm');
     btnSubmit.onclick = function()
     {
         //表单的submit()方法不能提交表单
         formId.submit();
     }
 }

양식이 제출된 경우 , 이 페이지에 프롬프트 메시지가 있을 것입니다

if(!empty($_GET['action']) && $_GET['action'] == 'register')
 {
     echo '你提交了数据';
     exit();
 }

오랜 시간 테스트한 결과 프롬프트 메시지가 표시되지 않았습니다. 코드나 메소드가 잘못되었기 때문인 줄 알았습니다. 잘못 적혀 있었습니다. 꼼꼼히 확인하고 공식 결과 문서를 확인하여 오류가 없는지 확인했습니다.

1. 양식에는 name="submit" 태그가 포함될 수 없습니다.

 this.type="submit"

2. 양식에는 "enctype="multipart/form-data""가 누락될 수 없습니다.

테스트해본 결과 이 ​​두 가지가 어이없네요. 문제가 해결되지 않았습니다. (문제 환경이 다를 수도 있습니다.)

나중에 포럼 친구들이 등록 버튼의 ID를 다음으로 변경하자고 제안한 것 같습니다. 제출하지 않고 다른 이름을 사용하세요. 수정 후 정상적으로 양식이 제출되고 프롬프트 메시지가 나타납니다.

최종 요약:

제출할 버튼의 ID를 설정하지 마세요. 그렇지 않으면 혼란을 야기하고 양식의 submit() 메소드가 양식 제출에 실패할 수 있습니다. ID 이름을 지정할 때 불필요한 번거로움을 피하기 위해 기존 API와 이름을 중복하지 않는 것이 가장 좋습니다.