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


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.