차단 양식 onSubmit

Question

html 양식의 onsubmit 이벤트를 가로 챌 수있는 방법이 있습니까? 웹 응용 프로그램에는 폼이 포함 된 여러 개의 스크린이 있습니다. 우리가 직면 한 문제는 사용자가 아무 버튼이나 여러 번 누르면 서버가 동일한 요청으로 오버로드됩니다. 일부 양식 (예 : onSubmit, button.onClick 등)에 이벤트 핸들러가 이미 첨부되어 있습니다. 한 가지 방법은 모든 화면을 통해 내 버튼 비활성화 코드를 "삽입"하는 것입니다.

하지만 내가 찾고있는 것은 함수가 작성된 스크립트를 포함하여 모든 화면에 적용 할 수있는 일반적인 솔루션입니다.

jQuery (양식에 대한 캡처)를 사용하여 콜백을 설정할 수 있다는 것을 알고 있지만이 경우 문제가되는 것은 화면에 onSubmit이 이미 등록되어 있으면 호출되지 않을 수도 있다는 것입니다.

감사합니다.

Answer 1

이미 jQuery를 사용하고 있다면 사용하는 것이 좋습니다 ... 양식의 onsubmit에 "return false"가 없거나 제출시 jQuery를 차단할 수 있어야합니다.

1. 이 양식의 onsubmit에서 거짓 어떤 수익 (있는 경우)를 제거

   다음은해야 할 일입니다. 나중에 jQuery에서 처리해도 걱정하지 마십시오.

2. "disableOnSubmit"과 같은 형식을 양식에 추가하십시오. 예 :

   <script type="text/javascript"> 
       $(document).ready(function(){ 
        $('form.disableOnClick').submit(function(e){ 
         // preventDefault() does the same as "return false;". It 
         // will not submit the form. If you're not using return false 
         // and want the form to be submitted remove the line below 
         e.preventDefault(); 
   
         // Now diable any submit button 
         $('input[type=submit], button[type=submit]').attr('disabled, 'disabled'); 
        }); 
       }); 
   </script> 
   

Answer 2

나는이 코드 조각을 시작하기에 좋은 장소라고 생각합니다 :

<form action="something" onsubmit="yourExistingCode" class="disableOnClick"> 
</form> 

또는

<form action="something" onsubmit="yourExistingCode" class="someOtherClass disableOnClick"> 
</form> 

과 유사한 코드를 구현합니다. 별개의 파일에 당신이 그것을 사용하고자하는 경우 포함되어야한다 (이 스크립트의 전역 목록이 나타납니다 경우 - 그것을위한 좋은 장소가)

var suppressed_items = []; 

function allowOnlyOne(item,e){ 
    if (jQuery.inArray(item, suppressed_items)==-1){ 
     //hi little item, I haven't saw you before, please go on... but I remember you 
     suppressed_items.push(item); 
     return true; 
    } 
    else{ 
     //Hey, you have been submitted already, stay where you are! 
     return false; //or e.preventDefault(), it's a matter of faith :) 
    } 
} 

jQuery(document).ready(function(){ 
    //don't worry, it won't replace your `ready` handlers, but just append new handler 
    jQuery("from").submit(function(e){ 
     return allowOnlyOne(jQuery(this),e); 
    }); 
}); 

당신은 어떤 항목으로 allowOnlyOne 기능을 사용 할 수 있습니다 소원. 난 당신이 기본적인 아이디어를 얻을 희망

jQuery("a").click(e){ 
    return allowOnlyOne(jQuery(this),e); 
} 

: 이벤트를 잡아 그것을 트리거 요소의 ID를 얻을에 공급 따라서, 예를 들어 그 ready 핸들러 추가 안에, 모든 하이퍼 링크에 클릭 한 번으로 가능합니다 이벤트와 함께 AllowOnlyOne 당신이 등등 incapsulation과를 달성하기 위해 자체 실행 폐쇄에 모든 주위를 래핑 할 수 물론

...