제출하기 전에 어떻게해야합니까? [닫은]


141

양식을 제출하는 버튼이있는 양식이 있습니다. 제출이 이루어지기 전에 무언가를해야합니다. 해당 버튼 에서 onClick 을 시도했지만 제출 후 발생합니다.

코드를 공유 할 수 없지만 일반적으로 jQuery 또는 JS에서이를 처리하려면 어떻게해야합니까?



2
@ 브래드 크리스티 (Brad Christie) 만 대답으로 의견을 받아 들일 수 있다면. 매우 도움이되었습니다.
지미

3
스택 오버가 질문을 닫을 때 나는 그것을 싫어합니다. 당신은 양식을 제출하기 전에 다음과 같은 이벤트 다음과 같은시기에 화재를 사용하여 작업을 처리 할 수 있습니다 : 1 onMouseover와 2으로 onMouseMove 3하면 onMouseDown 3- onfocus 및 5 onMouseUp에 6 온 클릭 7- onsubmit
샤디 Namrouti

1
최근에 같은 문제가 발생했기 때문에이 질문에 감사드립니다.이 질문은 내가 묻고 싶었던 것입니다.
wastetime909

2
이 질문이 실제 질문이 아니기 때문에이 질문이 닫히는 것이 재미 있습니다 :-?
AnnaKlein

답변:


207

이와 같은 양식이있는 경우 :

<form id="myform">
...
</form>

양식을 제출하기 전에 다음 jQuery 코드를 사용하여 무언가를 수행 할 수 있습니다.

$('#myform').submit(function() {
    // DO STUFF...
    return true; // return false to cancel form action
});

2
제출 전에 완료 해야하는 for 루프를 사용하는 데 문제가 있습니다. 어떤 제안?
Smilyan

볼 코드가 있습니까? 문제를 이해하지 못했습니다.
Dan Breen

3
왜 이것이 빈 함수 호출에 싸여 있습니까? 안 submit기능은 직접 바인딩 할 수 $('#form')주변의 빈 기능이없는? 편집 : 문서는 주변 함수 호출이 필요하지 않다고 제안합니다 .
eykanal

@eykanal 좋은 지적입니다. 계속해서 함수 래퍼를 제거하기 위해 답을 편집하여 제거 된 상태에서 제대로 작동하는지 확인한 후.
Jon Schneider

3
@eykanal 나는 "빈"함수 호출을 사용했다. 왜냐하면 jQuery $(document).ready()함수 의 약자이기 때문에 submit이벤트 를 첨부하기 전에 DOM이 완료되도록한다 . JS가 페이지의 맨 아래에 있으면 필요하지 않지만 <head>섹션에 있으면 JS가 필요합니다. 참조 : stackoverflow.com/q/13062246/135108
댄 브린

23

다음과 같은 양식이 있다고 가정하십시오.

<form id="myForm" action="foo.php" method="post">
   <input type="text" value="" />
   <input type="submit" value="submit form" />

</form>

다음 onsubmit과 같이 jQuery를 사용하여 -event를 첨부 할 수 있습니다 .

$('#myForm').submit(function() {
  alert('Handler for .submit() called.');
  return false;
});

만약 너라면 return false 당신이 진정한 반환하거나 아무것도가 평소와 같이 제출하지 않을 경우 형태는 기능 이후에 제출되지 않습니다.

자세한 내용은 jQuery 설명서 를 참조하십시오.


11

다음 onclick과 같은 양식을 제출하기 전에 JavaScript 또는 jQuery 코드를 실행 하는 데 사용할 수 있습니다 .

<script type="text/javascript">
    beforeSubmit = function(){
        if (1 == 1){
            //your before submit logic
        }        
        $("#formid").submit();            
    }
</script>
<input type="button" value="Click" onclick="beforeSubmit();" />

18
그러나 양식에 입력 필드가 포함 된 경우 사용자는 제출 이벤트를 발생시키는 리턴 키를 치고 있습니다. 일반적으로 제출 이벤트에 직접 첨부하여 사용자가 제출을 시작한 방법에 관계없이 호출되도록 할 수 있습니다.
acme

2
<input type = "submit"value = "Click"onmouseover = "beforeSubmit ();" />
Ansyori

5

제출 단추가 "제출"유형이 아닌지 확인하고 단추를 만드십시오. 그런 다음 onclick 이벤트를 사용하여 일부 자바 스크립트를 트리거하십시오. 실제로 데이터를 게시하기 전에 원하는 모든 작업을 수행 할 수 있습니다.


3
특정 필드에서 Enter 키를 누르는 등 여러 가지 방법으로 양식을 제출할 수 있습니다. 클릭하지 않을 수있는 하나의 버튼 클릭에 바인딩하는 것은 좋은 생각이 아닙니다. 다른 답변 onsubmit양식 바인딩 방법을 보여 주므로 양식 제출 방법에 관계없이 실행됩니다.
Jason
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.