Лучший способ удалить обработчик событий в jQuery?

Это было недоступно, когда на этот вопрос был дан ответ, но вы также можете использовать live () метод включения / выключения событий.

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

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

что произойдет с этим кодом, так это то, что при нажатии #mydisablebutton он добавит класс disabled в элемент #myimage. Это сделает так, что селектор больше не соответствует элементу, и событие не будет запущено, пока не будет удален класс "disabled".жить() селектор действует снова.

Это имеет и другие преимущества, добавляя стиль на основе этого класса, а также.

Это можно сделать с помощью функции unbind.

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

вы можете добавить несколько обработчиков событий к одному объекту и событию в jquery. Это означает, что добавление нового не заменяет старые.

существует несколько стратегий для изменения обработчиков событий, таких как пространства имен событий. Есть несколько страниц об этом в онлайн-документации.

посмотрите на этот вопрос (вот как я узнал о unbind). Существует некоторое полезное описание этих стратегий в ответ.

Как читать связанные функции обратного вызова при наведении в jquery

Если вы хотите ответить на событие только один раз следующий синтаксис должен быть действительно полезным:

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

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

С помощью аргументов.вызываемый, мы можем гарантировать, что один конкретный обработчик анонимной функции будет удален и, таким образом, будет иметь один обработчик времени для данного события. Надеюсь, это поможет другим.

может быть, метод unbind будет работать для вас

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

Я должен был установить событие в null с помощью prop и attr. Я не мог сделать этого ни с тем, ни с другим. Я тоже не мог попасть .отвяжитесь от работы. Я работаю над элементом TD.

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

вы можете добавить onclick обработчик в виде встроенной разметки:

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

если да, то jquery .off() или .unbind() не будет работать. Вам также нужно добавить исходный обработчик событий в jquery:

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

тогда jquery имеет ссылку на обработчик событий и может удалить его:

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

VoidKing упоминает об этом немного более косвенно в комментарии выше.

Если событие прилагается таким образом, и цель должна быть не привязана:

$('#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.

});​

обновлено на 2014 год

используя последнюю версию jQuery, теперь вы можете отменить привязку всех событий в пространстве имен, просто сделав $( "#foo" ).off( ".myNamespace" );

Спасибо за информацию. очень полезно я использовал его для блокировки взаимодействия страниц в режиме редактирования другим пользователем. Я использовал его в сочетании с ajaxComplete. Не обязательно то же самое поведение, но несколько похожее.

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

function executePageLock(){
    //do something
}

лучший способ удалить встроенное событие onclick-это $(element).prop('onclick', null);

в случае .on() метод ранее использовался с определенным селектором, как в следующем примере:

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

и unbind() и .off() методы не иду на работу.

однако, .undelegate() метод может быть использован для полного удаления обработчика из события для всех элементов, которые соответствуют текущему селектору:

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

Это тоже отлично работает .Просто и легко.см.http://jsfiddle.net/uZc8w/570/

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

если вы выберите onclick через html вам нужно removeAttr ($(this).removeAttr('onclick'))

если вы установите его через jQuery (как после первого клика в моих примерах выше), то вам нужно unbind($(this).unbind('click'))

до removeвсеevent-handlers, это то, что сработало для меня:

чтобы удалить все обработчики событий, нужно иметь равнину HTML structure не все event handlers присоединена к element и child nodes. Чтобы сделать это,jQuery's clone() помогло.

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);

С этим, мы будем иметь clone вместо original С event-handlers на нем.

Удачи...

надеюсь, что мой ниже код объясняет все. 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>

Я знаю, что это приходит поздно, но почему бы не использовать простой JS для удаления события?

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

или, если использовать именованную функцию в качестве обработчика событий:

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

все описанные подходы не работали для меня, потому что я добавлял событие click с on() к документу, в котором элемент был создан во время выполнения:

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

мое решение:

как я не мог разомкнуть ".кнопка " класс я только что назначил другой класс для кнопки, которая имела те же стили CSS. При этом обработчик live/on-event-handler проигнорировал щелчок наконец:

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

надеюсь, что это поможет.