JS를 사용하여 양식을 제출하는 몇 가지 방법과 확인(필독)

작업 중 양식 제출이 편리한 문제를 발견했습니다. 많은 경우 IE에서 제출이 잘되지만, 파이어폭스에서는 문제가 발생하고, 제출 버튼을 사용하면 성공하지 않습니다. 따라서 JS 방식을 사용하면 성공합니다. 왜 그런지는 알 수 없습니다. 지도사의 권장으로 이러한 몇 가지 일반적인 양식 제출 방법을 요약했습니다.

첫 번째 방법:양식 제출, form 태그에 onsubmit 이벤트를 추가하여 양식 제출이 성공했는지 확인합니다

<script type="text/javascript">
   function validate(obj) {
    if (confirm("양식 제출?")) {
      alert(obj.value);
      return true;
    } else {
      alert(obj.value);
      return false;
    }
   }
 </script>
 <body>
  <form action="https://ko.oldtoolbag.com" onsubmit="return validate(document.getElementByIdx_x('myText'));"> <!—이러한 매개변수의 작성법을 주의하세요-->
    <input type="text" id="myText"/>
    <input type="submit" value="submit"/>
  </form>
</body>

두 번째 방법:button 버튼을 통해 양식 제출 이벤트 onclick="submitForm();"을 트리거하면, 다른 태그의 속성을 무시합니다. 예를 들어, form 태그의 onsubmit 속성은 비활성화됩니다. 이 경우 양식 검증을 위해 validate 코드를 submitForm(); 메서드에 배치할 수 있습니다.

<script type="text/javascript">
   function validate() {
    if (confirm("양식 제출?")) {
      return true;
    } else {
      return false;
    }
   }
   function submitForm() {
    if (validate()) {
      document.getElementByIdx_x("myForm").submit();
    }
   }
 </script>
 <body>
  <form action="https://ko.oldtoolbag.com" id="myForm">
    <input type="text"/>
    <input type="button" value="submitBtn" onclick="submitForm();"/> <!—아래와 같이 document.getElementByIdx_x(“이 버튼의 id”).click();를 사용하여 onclick 이벤트를 실행할 수 있습니다-->
  </form>
</body>

세 번째 방법:onsubmit 이벤트를 form 태그 대신 submit 태그에 두면, 양식 검증이 비활성화되고, 제출 버튼을 클릭하면 양식이 직접 제출됩니다.

<script type="text/javascript">
   function validate() {
    if (confirm("양식 제출?")) {
      return true;
    } else {
      return false;
    }
   }
 </script>
 <body>
  <form action="https://ko.oldtoolbag.com">
    <input type="text"/>
    <input type="submit" value="submit" onsubmit="return validate()"/>
  </form>
</body>

네 번째 방법:submit 버튼에 onclick 이벤트를 추가하면, 이 이벤트는 양식 제출 검증에 사용되며, form 태그에 onsubmit 이벤트를 추가한 것과 유사한 기능을 가집니다.

<script type="text/javascript">
   function validate() {
    if (confirm("양식 제출?")) {
      return true;
    } else {
      return false;
    }
   }
 </script>
 <body>
  <form action="https://ko.oldtoolbag.com">
    <input type="text"/>
    <input type="submit" value="submit" onclick="return validate()"/>
  </form>
</body>

다섯 번째 방법:

<body>
  <form action="https://ko.oldtoolbag.com" id="myForm">
  <input type="text"/>
  <input type="button" value="submitBtn" id="myBtn"/>
  </form>
 </body>
  <script type="text/javascript">
   function validate() {
      if (confirm("양식 제출?")) {
        return true;
      } else {
        return false;
      }
}

button 버튼을 통해 양식 제출 이벤트를 트리거합니다. onclick="submitForm();"와 같이 다른 태그의 속성을 무시합니다. 예를 들어, form 태그의 onsubmit 속성이 비활성화됩니다. 이 경우, 양식 검증을 위해 validate() 메서드에 검증 코드를 추가할 수 있습니다.

function submitForm() {
      if (validate()) {
        document.getElementByIdx_x("myForm").submit();
      }
   }
   document.getElementByIdx_x("myBtn").onclick = submitForm;
</script>

이 글에서는 JS를 사용하여 양식을 제출하는 여러 가지 방법과 검증(빌려보세요)에 대해 소개했습니다. 이를 통해 여러분께 참고가 되길 바랍니다. 또한, 나의 노래教程을 많이 지지해 주시길 바랍니다.

기본 가이드

좋아하는 것