evt.preventDefault ()의 반대는 무엇입니까?


185

를 해고하면 evt.preventDefault()기본 작업을 다시 재개 하려면 어떻게해야합니까?


3
당신이 처음에 evt.preventDefault ()를 호출하지 않을 것, 그래서 나는 일반적으로 기능이 실행됩니다 생각하고 기본 동작이 실행됩니다
프레스콧


2
@ Nobita-확실하지 않습니다 ... 하나는 jQuery에만 해당됩니다.
gilly3

1
와우, 빠른 답변 감사합니다! 내 문제는 evt.preventDefault ();를 실행하는 사람이 아니라는 것입니다. 라이트 박스에서 타사 플래시 애플리케이션을 실행하고 있습니다. 라이트 박스를 닫으면 페이지 스크롤을위한 마우스 휠이 멈 춥니 다. 일부 조사를 통해이 플래시 응용 프로그램은 확대 / 축소 기능으로 인해 페이지 스크롤을 비활성화합니다. 이제 앱이 닫히면 페이지 스크롤을 다시 시작하려고합니다. 마우스 휠 이벤트를 재개하기 위해 호출 할 수있는 방법이 있습니까?
Bryan

답변:


90

@Prescott의 의견에 따르면 다음과 반대입니다.

evt.preventDefault();

될 수 있습니다 :

더 이상 방해하지 않기 때문에 기본적으로 '기본 설정' 과 동일시 합니다.

그렇지 않으면 다른 의견과 답변에서 제공하는 답변을 알려줍니다.

jQuery를 사용하여 event.preventDefault ()를 호출하는 리스너를 바인딩 해제하는 방법은 무엇입니까?

event.preventDefault를 다시 활성화하는 방법?

두 번째 솔루션은 redsquare이 제공 한 예제 솔루션으로 승인되었습니다 (이것이 중복으로 닫히지 않은 경우 직접 솔루션을 위해 여기에 게시 됨).

$('form').submit( function(ev) {
     ev.preventDefault();
     //later you decide you want to submit
     $(this).unbind('submit').submit()
});

감사합니다! 이것에 대해 잠시 동안 머리를 긁적였습니다 (특정 상황에서는 제출하지 않고 다른 것은 제출하지 않고 양식 제출 전에 몇 가지를 중지하고 확인해야했습니다).
캐서린 오스본

1
작동하지만 다음 양식 제출이 함수를 다시 호출하는 이유를 이해하지 못합니다. 확실히 바인드 해제한다고 생각했지만 현재 호출에서만 바인드 해제 된 것처럼 보입니다 ... 설명 할 수는 없습니다. 정확히 내가 원하는 것이지만 내가 기대했던 것이 아닙니다.
Vadorequest

53
function(evt) {evt.preventDefault();}

그리고 그 반대

function(evt) {return true;}

건배!


8
이것은 나를 위해 일했지만 누군가 왜 그것을 조금 더 잘 설명 할 수 있는지 궁금합니다.
edhedges

11
이것은 preventDefault ()를 취소하지 않습니다. 실제로 return true: none을 생략하는 것과 같습니다.
br4nnigan

19

clickjQuery 의 이벤트에서 링크를 계속하기 전에 명령을 처리하려면 다음을 수행하십시오 .

예 : <a href="http://google.com/" class="myevent">Click me</a>

jQuery를 방지하고 따르십시오.

$('a.myevent').click(function(event) {
    event.preventDefault();

    // Do my commands
    if( myEventThingFirst() )
    {
      // then redirect to original location
      window.location = this.href;
    }
    else
    {
      alert("Couldn't do my thing first");
    }
});

또는 단순히 실행 window.location = this.href;애프터preventDefault();


3
그러나 이것은 preventDefault가 링크이며 문서 본문에 touchmove라고 말하지 않는다고 가정합니다.
Bangkokian

4
이것은 질문이 아닙니다.
매트 플레처

8

비동기 호출을 실행하기 위해 jQuery에서 양식 제출을 지연해야했습니다. 간단한 코드는 다음과 같습니다.

$("$theform").submit(function(e) {
    e.preventDefault();
    var $this = $(this);
    $.ajax('/path/to/script.php',
        {
        type: "POST",
        data: { value: $("#input_control").val() }
    }).done(function(response) {
        $this.unbind('submit').submit();
    });
});

이 시나리오의 또 다른 옵션은 input type = "submit"을 사용하고 제출 이벤트에 바인딩하는 대신 input type = "button"을 사용하고 click 이벤트에 바인딩하는 것입니다.
Strixy 2016 년

8

확인 ! 클릭 이벤트에서 작동합니다.

$("#submit").click(function(e){ 

   e.preventDefault();

  -> block the click of the sumbit ... do what you want

$("#submit").unbind('click').click(); // the html click submit work now !

});


4

다음과 같은 패턴을 제안합니다.

document.getElementById("foo").onsubmit = function(e) {
    if (document.getElementById("test").value == "test") {
        return true;
    } else {
        e.preventDefault();
    }
}

<form id="foo">
    <input id="test"/>
    <input type="submit"/>
</form>

... 내가 뭔가를 빠뜨리지 않는 한.

http://jsfiddle.net/DdvcX/


4

event.preventDefault()왜 당신이 event.preventDefault()그것을 부를 때 무엇을 조사해야하는지 이해하는 반대의 방법은 없습니다 .

후드 아래에서 preventDefault의 기능은 본질적으로 추가 실행을 중지시키는 return false를 호출합니다. Javascript의 이전 방법에 익숙하다면, 양식 제출 및 return true (jQuery가 주변에 있기 전에)를 사용하여 버튼을 취소하는 데 return false를 사용하는 것이 유행이었습니다.

아마도 위의 간단한 설명을 바탕으로 이미 운동했을 것입니다. 그 반대 event.preventDefault()는 아무것도 아닙니다. 이벤트를 막지 않고 기본적으로 브라우저는 이벤트를 막지 않으면 이벤트를 허용합니다.

설명은 아래를 참조하십시오.

;(function($, window, document, undefined)) {

    $(function() {
        // By default deny the submit
        var allowSubmit = false;

        $("#someform").on("submit", function(event) {

            if (!allowSubmit) {
                event.preventDefault();

                // Your code logic in here (maybe form validation or something)
                // Then you set allowSubmit to true so this code is bypassed

                allowSubmit = true;
            }

        });
    });

})(jQuery, window, document);

위 코드에서 allowSubmit이 false인지 확인하고 있음을 알 수 있습니다. 즉, 양식을 사용하여 제출하지 못하게하고 event.preventDefault유효성 검사 논리를 수행하고 만족스러운 경우 allowSubmit을 true로 설정합니다.

이것은 실제로 반대되는 유일한 효과적인 방법입니다. event.preventDefault()본질적으로 동일한 것을 달성 할 수있는 이벤트도 제거 할 수 있습니다.


4

유용한 것이 있습니다 ...

먼저 링크를 클릭하고 코드를 실행 한 다음 기본 작업을 수행합니다. event.currentTarget을 사용하여 가능합니다 . 여기서는 새 탭에서 Google에 액세스하려고하지만 코드를 실행하기 전에 시도합니다.

<a href="https://www.google.com.br" target="_blank" id="link">Google</a>

<script type="text/javascript">
    $(document).ready(function() {
        $("#link").click(function(e) {

            // Prevent default action
            e.preventDefault();

            // Here you'll put your code, what you want to execute before default action
            alert(123); 

            // Prevent infinite loop
            $(this).unbind('click');

            // Execute default action
            e.currentTarget.click();
        });
    });
</script>

2

이것이 내가 설정했던 것입니다.

$("body").on('touchmove', function(e){ 
    e.preventDefault(); 
});

그리고 그것을 취소하려면 :

$("body").unbind("touchmove");

2

어떤 해결책도 도움이되지 않았으며 상황을 해결하기 위해이 작업을 수행했습니다.

<a onclick="return clickEvent(event);" href="/contact-us">

그리고 기능 clickEvent(),

function clickEvent(event) {
    event.preventDefault();
    // do your thing here

    // remove the onclick event trigger and continue with the event
    event.target.parentElement.onclick = null;
    event.target.parentElement.click();
}

2

"반대"는 이벤트를 시뮬레이션하는 것이라고 생각합니다. 당신은 사용할 수 있습니다.createEvent()

Mozilla의 예를 따르면 다음과 같습니다.

function simulateClick() {
  var evt = document.createEvent("MouseEvents");
  evt.initMouseEvent("click", true, true, window,
    0, 0, 0, 0, 0, false, false, false, false, 0, null);
  var cb = document.getElementById("checkbox"); 
  var cancelled = !cb.dispatchEvent(evt);
  if(cancelled) {
    // A handler called preventDefault
    alert("cancelled");
  } else {
    // None of the handlers called preventDefault
    alert("not cancelled");
  }
}

참조 : document.createEvent


jQuery를 .trigger()사용하면 요소에 대한 이벤트를 트리거 할 수 있으며 때로는 유용합니다.

$('#foo').bind('click', function() {
      alert($(this).text());
});

$('#foo').trigger('click');

1

jquery on () 은 이것에 대한 또 다른 해결책이 될 수 있습니다. escpacially 그것의 사용에 관해서 네임 스페이스 .

jquery on ()은 이벤트를 바인딩하는 현재 방법입니다 (bind () 대신). off ()는 이들을 바인딩 해제하는 것입니다. 네임 스페이스를 사용하면 여러 개의 다른 이벤트를 추가하고 제거 할 수 있습니다.

$( selector ).on("submit.my-namespace", function( event ) {
    //prevent the event
    event.preventDefault();

    //cache the selector
    var $this = $(this);

    if ( my_condition_is_true ) {
        //when 'my_condition_is_true' is met, the binding is removed and the event is triggered again.
        $this.off("submit.my-namespace").trigger("submit");
    }
});

이제 네임 스페이스를 사용하면 이러한 이벤트를 여러 개 추가 할 수 있으며 필요에 따라 이벤트를 제거 할 수 있습니다. 제출이 가장 좋은 예는 아니지만 클릭 또는 키 누르기 등에 유용 할 수 있습니다.


1

이것은 질문에 대한 직접적인 대답은 아니지만 누군가에게 도움이 될 수 있습니다. 내 요점은 모든 경우에 preventDefault ()를 호출하면 이벤트가 발생할 점이 없기 때문에 일부 조건에 따라 preventDefault () 만 호출한다는 것입니다. 따라서 조건이 충족되고 조건이 충족 될 때만 preventDefault ()를 호출하면 다른 경우에는 일반적인 방식으로 함수가 작동합니다.

$('.btnEdit').click(function(e) {

   var status = $(this).closest('tr').find('td').eq(3).html().trim();
   var tripId = $(this).attr('tripId');

  if (status == 'Completed') {

     e.preventDefault();
     alert("You can't edit completed reservations");

 } else if (tripId != '') {

    e.preventDefault();
    alert("You can't edit a reservation which is already attached to a trip");
 }
 //else it will continue as usual

});


0

"preventDefault"메소드 이후에이를 사용할 수 있습니다.

//evt.target은 기본 이벤트를 반환합니다 (예 : defult url 등).

var defaultEvent=evt.target;

// 여기서 기본 이벤트를 저장합니다.

if("true")
{
//activate default event..
location.href(defaultEvent);
}

0

스크립트의 클릭 이벤트에 항상 첨부하여 사용할 수 있습니다.

location.href = this.href;

사용 예는 다음과 같습니다.

jQuery('a').click(function(e) {
    location.href = this.href;
});

-1

이 코드는 내가 사용한 후에 이벤트를 다시 인스턴스화하는 데 도움이되었습니다.

event.preventDefault(); to disable the event.


event.preventDefault = false;

-2

다음 코드를 사용했습니다. 그것은 나를 위해 잘 작동합니다.

$('a').bind('click', function(e) {
  e.stopPropagation();
});

2
jQuery API 문서에 설명 된대로 이벤트가 DOM 트리를 버블 링하지 못하도록하여 상위 핸들러가 이벤트에 대한 알림을받지 못하게합니다. 그것은 같거나 반대입니다 event.preventDefault().
ᴍᴀᴛᴛ ʙᴀᴋᴇʀ

2
이것은 질문이 한 것이 아닙니다.
매트 플레처
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.