Обработчики нескольких событий jQuery - как отменить?

У меня есть две функции, привязанные к событию щелчка в два разных времени (с использованием jQuery). Порядок, в котором они стреляют, имеет большое значение. Они стреляют в правильном порядке. Проблема в том, что когда первая функция возвращает false, вторая функция все еще запускается!

Как правильно отменить мероприятие?

Пример кода:

$(document).click(function() { 
  alert('a');
  return false;
});

$(document).click(function() {
  alert('b');
});

Вы по-прежнему будете видеть предупреждающее сообщение «b» при нажатии на страницу. Это неприемлемо!


jquery event-handling jquery-events
person Josh Stodola    schedule 16.03.2009    source источник

Ответы (6)


arrow_upward
88
arrow_downward

Используйте функцию stopImmediatePropagation объекта события jQuery.

Предотвращает выполнение остальных обработчиков. Этот метод также останавливает восходящую цепочку путем вызова event.stopPropagation ().

$(document).click(function(event) { 
  alert('a');
  event.stopImmediatePropagation();
  return false;
});

$(document).click(function() {
  alert('b');
});
person Ken Browning    schedule 16.03.2009
comment
Возможно, вы захотите отметить, что вам нужно использовать jQuery версии 1.3 и выше, чтобы это работало. - person Josh Stodola; 17.03.2009
comment
как насчет $ (document) .on (touchstart click, .myelement, function (e) {e.stopImmediatePropagtion (); // запускать функцию здесь}) ... Если сенсорный запуск сначала срабатывает на планшетном устройстве, он отменит щелчок от выстрела, если я держу палец нажатым? - person Alex; 28.06.2012

arrow_upward
2
arrow_downward

Первое, что я спрашиваю: почему у вас есть две функции, привязанные к одному и тому же событию клика? Имея доступ к коду, почему бы вам просто не сделать один единственный звонок?

$(function (){
    var callbackOne = function(e){
        alert("I'm the first callback... Warning, I might return false!");
        return false;
    };

    var callbackTwo = function(e){
        alert("I'm the second callback");
    };

    $(document).click(function (e){
        if(callbackOne(e)){
            callbackTwo(e);
        }
    });
});
person Seb    schedule 16.03.2009
comment
Организация. В этом приложении очень много кода Javascript, и он разделен на НЕСКОЛЬКО файлов. Таким образом, каждая страница загружает только то, что необходимо, что приводит к быстрой загрузке. У меня есть обработчик HTTP, который объединяет, сжимает и кэширует их, поэтому все они получаются одним запросом. - person Josh Stodola; 17.03.2009
comment
В порядке. Так действительно ли нужна -1? Просто пытаюсь помочь ... Вашего объяснения достаточно, чтобы мы все знали, что это не решение для вас. - person Seb; 17.03.2009
comment
Тогда извини! :) Не знаю, кто захочет растратить свою репутацию, проголосовав против возможного правильного ответа для других ... - person Seb; 17.03.2009
comment
+1. Я ответил на множество вопросов, спросив: «Почему вы делаете это так, а не иначе?» Иногда спрашивающий не знает или забывает рассмотреть другие варианты. - person Spencer Ruport; 17.03.2009

arrow_upward
2
arrow_downward

Спасибо, unbind работает для переопределения функций.

  $(document).ready(function(){
        $("#buscar_mercaderia").click(function(){ alert('Seleccione Tipo de mercaderia'); 
   });
$(".tipo").live('click',function(){
            if($(this).attr('checked')!=''){
                if($(this).val()=='libro'){
                    $("#buscar_mercaderia").unbind('click');
                    $("#buscar_mercaderia").click(function(){  window.open('buscar_libro.php','Buscar Libros', 'width=800,height=500'); });
                }else if($(this).val()=='otra'){
                    $("#buscar_mercaderia").unbind('click');
                    $("#buscar_mercaderia").click(function(){ window.open('buscar_mercaderia.php','Buscar Mercaderias', 'width=800,height=500');  });
                }
            }
        })
person Rodrigo Jara    schedule 04.03.2011

arrow_upward
1
arrow_downward

Помогает ли использование отвязки?

$(document).click(function() { 
  alert('a');
  $(this).unbind('click');
  return false;
});
person nickf    schedule 16.03.2009
comment
Мне все еще нужно, чтобы мое второе событие сработало, когда первая функция НЕ возвращает false. Разве развязывание не развяжет его буквально? - person Josh Stodola; 17.03.2009
comment
вы можете объединить мое решение с решением nickf, и вы получите свое поведение :) - person fmsf; 17.03.2009
comment
Проблема с отменой привязки заключается в том, что другая связанная функция не сработает. - person Seb; 17.03.2009
comment
Весь подход кажется безвкусным обходным решением! Мне нужен простой способ отменить мероприятие, не более того. В обычном Javascript возврат означает возврат, будь он истинным или ложным. В jQuery все по-другому. ДОЛЖЕН быть способ имитировать возврат с помощью jQuery. - person Josh Stodola; 17.03.2009
comment
jquery - это javascript: p, это просто библиотека, а не новый язык - person fmsf; 17.03.2009
comment
@ Джош: Нет причин быть грубым. Вырежьте это. - person Paolo Bergantino; 17.03.2009

arrow_upward
0
arrow_downward

Если то, что сказал nickf, не работает, вы можете использовать небольшой конечный автомат:

var trigger = 0;

$(document).click(function() { 

  alert('a');
  if(you_want_to_return_false) {
    trigger = 1;
    return false;
  }
});

$(document).click(function() {
  if(trigger !== 0) {
  alert('b');
  } 
  trigger = 0;
});

Не самое красивое решение, но оно сработает.

person fmsf    schedule 16.03.2009
comment
ну, моя идея работает просто в то же время ломает ее. +1 за эту идею. - person nickf; 17.03.2009
comment
Этот метод ломается точно так же, как и другой, только с большим количеством кода. Поправьте меня, если я ошибаюсь. - person Josh Stodola; 17.03.2009

arrow_upward
0
arrow_downward

Другое решение - дребезг или дросселирование функции.

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

person Spencer Miles    schedule 08.09.2020