Najlepszy sposób na usunięcie obsługi zdarzeń w jQuery?

To nie było dostępne, gdy odpowiedź na to pytanie została udzielona, ale możesz również użyć metody live(), aby włączyć/wyłączyć zdarzenia.

$('#myimage:not(.disabled)').live('click', myclickevent);

$('#mydisablebutton').click( function () { $('#myimage').addClass('disabled'); });

Co się stanie z tym kodem jest to, że po kliknięciu #mydisablebutton, doda klasę wyłączoną do elementu # myimage. Spowoduje to, że selektor nie będzie już pasował do elementu i zdarzenie nie zostanie wywołane, dopóki Klasa 'disabled' nie zostanie usunięta .selektor live() ponownie poprawny.

To ma inne korzyści dodając stylizację opartą również na tej klasie.

Można to zrobić za pomocą funkcji unbind.

$('#myimage').unbind('click');

Możesz dodać wiele procesów obsługi zdarzeń do tego samego obiektu i zdarzenia w jquery. Oznacza to, że dodanie nowego nie zastępuje starych.

Istnieje kilka strategii zmiany procedur obsługi zdarzeń, takich jak przestrzenie nazw zdarzeń. Jest kilka stron o tym w dokumentach online.

Spójrz na to pytanie (tak dowiedziałem się o unbind). Istnieje kilka przydatnych opis tych strategii w odpowiedzi.

Jak odczytać związane funkcje wywołania zwrotnego hover w jquery

Jeśli chcesz odpowiedzieć na zdarzenie tylko jeden raz, poniższa składnia powinna być naprawdę pomocna:

 $('.myLink').bind('click', function() {
   //do some things

   $(this).unbind('click', arguments.callee); //unbind *just this handler*
 });

Używanie argumentów .callee , możemy zapewnić, że jedna konkretna funkcja obsługi funkcji anonimowych zostanie usunięta, a tym samym będzie miała jeden Czas Obsługi dla danego zdarzenia. Mam nadzieję, że to pomoże innym.

Może metoda unbind będzie działać dla ciebie

$("#myimage").unbind("click");

Musiałem ustawić Zdarzenie NA null używając propa i attr. Nie mogłem tego zrobić z jednym lub drugim. Ja też nie mogłem dostać .odepnij się do pracy. Pracuję nad elementem TD.

.prop("onclick", null).attr("onclick", null)

Możesz dodać obsługę onclick jako znacznik inline:

<input id="addreport" type="button" value="Add New Report" onclick="openAdd()" />

Jeśli tak, jquery .off() lub .unbind() nie będzie działać. Musisz również dodać oryginalny program obsługi zdarzeń w jquery:

$("#addreport").on("click", "", function (e) {
   openAdd();
});

Następnie jquery ma odniesienie do obsługi zdarzenia i może go usunąć:

$("#addreport").off("click")

VoidKing wspomina o tym nieco bardziej skośnie w komentarzu powyżej.

Jeśli zdarzenie jest dołączone w ten sposób , a cel ma być odłączony:

$('#container').on('click','span',function(eo){
    alert(1);

    $(this).off(); //seams easy, but does not work

    $('#container').off('click','span'); //clears click event for every span

    $(this).on("click",function(){return false;}); //this works.

});​

Aktualizacja dla 2014

Używając najnowszej wersji jQuery, możesz teraz odłączyć wszystkie zdarzenia w przestrzeni nazw, wykonując po prostu $( "#foo" ).off( ".myNamespace" );

Dzięki za informacje. bardzo pomocne użyłem go do blokowania interakcji strony w trybie edycji przez innego użytkownika. Używałem go w połączeniu z ajaxComplete. Nie musi być to samo zachowanie, ale nieco podobne.

function userPageLock(){
    $("body").bind("ajaxComplete.lockpage", function(){
        $("body").unbind("ajaxComplete.lockpage");
        executePageLock();      
    });
};  

function executePageLock(){
    //do something
}

Najlepszym sposobem na usunięcie zdarzenia onclick inline jest $(element).prop('onclick', null);

W przypadku .on() metoda była wcześniej używana z konkretnym selektorem, jak w poniższym przykładzie:

$('body').on('click', '.dynamicTarget', function () {
    // Code goes here
});

Obie metody unbind() i .off() nie działają .

Jednak .metoda undelegate () może być użyta do całkowitego usunięcia obsługi ze zdarzenia dla wszystkich elementów pasujących do bieżącego selektora:

$("body").undelegate(".dynamicTarget", "click")

To również działa dobrze .Proste i łatwe.zobacz http://jsfiddle.net/uZc8w/570/

$('#myimage').removeAttr("click");

Jeśli ustawisz onclick przez html Musisz removeAttr ($(this).removeAttr('onclick'))

Jeśli ustawisz go przez jquery (jak po pierwszym kliknięciu w moich przykładach powyżej) to musisz unbind($(this).unbind('click'))

To remove wszystkie event-handlers, to mi się udało:

Aby usunąć wszystkie procedury obsługi zdarzeń, należy mieć zwykły HTML structure bez wszystkich event handlers dołączonych do element i jego child nodes. Aby to zrobić, jQuery's clone() pomógł.

var original, clone;
// element with id my-div and its child nodes have some event-handlers
original = $('#my-div');
clone = original.clone();
//
original.replaceWith(clone);

Z tym, będziemy mieć clone w miejsce original Bez event-handlers na nim.

Mam nadzieję, że mój poniższy kod wszystko wyjaśni. HTML:

(function($){

     $("#btn_add").on("click",function(){
       $("#btn_click").on("click",added_handler);
       alert("Added new handler to button 1");
     });

  
 
     $("#btn_remove").on("click",function(){
       $("#btn_click").off("click",added_handler);
       alert("Removed new handler to button 1");
     });

  
   function fixed_handler(){
    alert("Fixed handler");
  }
  
   function added_handler(){
    alert("new handler");
  }
  
  $("#btn_click").on("click",fixed_handler);
  $("#btn_fixed").on("click",fixed_handler);
  
  
})(jQuery);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="btn_click">Button 1</button>
  <button id="btn_add">Add Handler</button>
  <button id="btn_remove">Remove Handler</button>
  <button id="btn_fixed">Fixed Handler</button>

Wiem, że to przychodzi późno, ale dlaczego nie użyć zwykłego JS do usunięcia zdarzenia?

var myElement = document.getElementByID("your_ID");
myElement.onclick = null;

Lub, jeśli używasz nazwanej funkcji jako obsługi zdarzenia:

function eh(event){...}
var myElement = document.getElementByID("your_ID");
myElement.addEventListener("click",eh); // add event handler
myElement.removeEventListener("click",eh); //remove it

Wszystkie opisane podejścia nie działały dla mnie, ponieważ dodawałem Zdarzenie click z on() do dokumentu, w którym element został utworzony w czasie wykonywania:

$(document).on("click", ".button", function() {
    doSomething();
});

moje obejście:

Ponieważ nie mogłem odpiąć".button " class I just assigned another class to the button that had the same CSS styles. W ten sposób live/on-event-handler zignorował kliknięcie w końcu:

// prevent another click on the button by assigning another class
$(".button").attr("class","buttonOff");