복붙노트

[JQUERY] 양식에 방지 기본은 jQuery를 제출

JQUERY

양식에 방지 기본은 jQuery를 제출

해결법


  1. 1.이 시도:

    이 시도:

    $("#cpa-form").submit(function(e){
        return false;
    });
    

  2. 2.이벤트 구문 "의"새를 사용합니다.

    이벤트 구문 "의"새를 사용합니다.

    $(document).ready(function() {
      $('form').on('submit', function(e){
        // validation code here
        if(!valid) {
          e.preventDefault();
        }
      });
    });
    

    인용 : https://api.jquery.com/on/


  3. 3.나는 위의 답변이 모두 올바른지 생각하지만, 방법이 작동하지 않는 제출 이유를 지적하지 않습니다.

    나는 위의 답변이 모두 올바른지 생각하지만, 방법이 작동하지 않는 제출 이유를 지적하지 않습니다.

    음,이 방법은 작업 jQuery를 양식 요소를 얻을 수하지 않을 경우 제출하고 jQuery를 그것에 대해 오류를 제공하지 않습니다. 스크립트는 문서의 헤드에 배치되어있는 경우 DOM이 준비 후, 확인 코드 실행을합니다. 그래서, $ (문서) .ready (함수 () {// 여기에 코드 //}); 이 문제를 해결합니다.

    가장 좋은 방법은 항상 문서의 하단에 스크립트를 넣어.


  4. 4.이것은 고대 질문이지만, 여기 허용 대답은 정말 문제의 근본에 도착하지 않습니다.

    이것은 고대 질문이지만, 여기 허용 대답은 정말 문제의 근본에 도착하지 않습니다.

    이 두 가지 방법으로 해결할 수 있습니다. jQuery로 첫째 :

    $(document).ready( function() { // Wait until document is fully parsed
      $("#cpa-form").on('submit', function(e){
    
         e.preventDefault();
    
      });
    })
    

    또는 jQuery를하지 않고 :

    // Gets a reference to the form element
    var form = document.getElementById('cpa-form');
    
    // Adds a listener for the "submit" event.
    form.addEventListener('submit', function(e) {
    
      e.preventDefault();
    
    });
    

    이 문제를 해결하기 위해 반환 거짓을 사용할 필요가 없습니다.


  5. 5.

    $('#cpa-form input[name="Next"]').on('click', function(e){
        e.preventDefault();
    });
    

  6. 6.

    $(document).ready(function(){
        $("#form_id").submit(function(){
            return condition;
        });
    });
    

  7. 7.귀하의 코드는 미세 그냥 당신이 준비가 함수 내에서 배치 할 필요가있다.

    귀하의 코드는 미세 그냥 당신이 준비가 함수 내에서 배치 할 필요가있다.

    $(document).ready( function() {
      $("#cpa-form").submit(function(e){
         e.preventDefault();
      });
    }
    

  8. 8.당신은 예를 나중에 추가 동적 양식에 대한이있는 경우 또한,이 코드를 시도 할 수 있습니다. 예를 들어, 당신은 아약스와 창 비동기로드하고이 양식을 제출합니다.

    당신은 예를 나중에 추가 동적 양식에 대한이있는 경우 또한,이 코드를 시도 할 수 있습니다. 예를 들어, 당신은 아약스와 창 비동기로드하고이 양식을 제출합니다.

    $('#cpa-form').live('submit' ,function(e){
        e.preventDefault();      
        // do something
    });
    

    사례 1, 정적 버전 : 당신이 하드 코딩 몇 청취자와 핸들에 양식이 있다면, 당신은 "문서 수준"에서 직접들을 수 있습니다. 나는 문서 수준에 리스너를 사용하지 것이다하지만 성능 문제가 발생할 (당신의 웹 사이트의 크기와 내용에 따라 다름) 수 있기 때문에 나는 운명 트리에 더 깊게하려고 할 것

    $('form#formToHandle').on('submit'... 
    

    또는

    $('form#formToHandle').submit(function(e) {
        e.preventDefault();      
        // do something
    });
    
    $(document).on('submit','form#formToHandle',function(){
       // do something like e.preventDefault(); 
    });
    

    또는

    $(document).ready(function() {
        console.log( "Ready, Document loaded!" );
    
        // all your other code listening to the document to load 
    
        $("#formToHandle").on("submit", function(){
            // do something           
        })
    });
    

    또는

    $(function() { // <- this is shorthand version
       console.log( "Ready, Document loaded!" );
    
        // all your other code listening to the document to load 
    
        $("#formToHandle").on("submit", function(){
            // do something           
        })
    });
    

  9. 9.안녕하세요 Google 태그 관리자 (GTM)과 아약스 양식 작업을 할 수있는 솔루션을 모색 반환 거짓이 완료 방지 및 분석 솔루션을 구글에 실시간으로 이벤트의 활성화를 제출하는 것은) (e.preventDefault에 의해 반환 거짓을 변경했다 ; 즉, 제대로 작동 코드를 다음과 같습니다 :

    안녕하세요 Google 태그 관리자 (GTM)과 아약스 양식 작업을 할 수있는 솔루션을 모색 반환 거짓이 완료 방지 및 분석 솔루션을 구글에 실시간으로 이벤트의 활성화를 제출하는 것은) (e.preventDefault에 의해 반환 거짓을 변경했다 ; 즉, 제대로 작동 코드를 다음과 같습니다 :

     $("#Contact-Form").submit(function(e) {
        e.preventDefault();
       ...
    });
    

  10. 10.당신이 당신의 자바 스크립트에 문제가 해달라고 경우에만 e.preventDefault ()는 잘 작동 e.preventDefault은 () 가능성이 JS의 일부 다른 부분도 작동하지 않을 수 있습니다 작동하지 않는 경우 자바 스크립트를 확인

    당신이 당신의 자바 스크립트에 문제가 해달라고 경우에만 e.preventDefault ()는 잘 작동 e.preventDefault은 () 가능성이 JS의 일부 다른 부분도 작동하지 않을 수 있습니다 작동하지 않는 경우 자바 스크립트를 확인


  11. 11.잘 나는 비슷한 문제가 발생했습니다. DOM을 발생 렌더링하기 전에 나를 위해 문제는 JS 파일이로드되는 것입니다. 그래서 태그의 끝 부분에