предотвратить выполнение событий в очереди в jquery

Question

У меня есть обработчик, который запускается для двух событий:

1. Триггер размытия объекта А.
2. нажмите на объект B.

Проблема в том, что когда у объекта A есть фокус, и я нажимаю на B, оба события запускаются. Я хочу, чтобы это не случилось. В этом случае обработчик должен выполняться только один раз, потому что внутри есть функция toggle (), которая обнуляется из-за второго вызова. Можно ли как-то очистить все ожидающие события на объекте?

<div id='panel'>Hey!</div>    

<input type='text' id='a'>
<div id='b'>Hello</div>

---

function handler() {
    $('#panel').toggle();
}

$('#a').blur(handler);
$('#b').click(handler);

Когда текстовое поле имеет фокус и , пользователь нажимает на div 'b', запускаются два события - размытие ввода a и нажмите div b . Оба события обрабатываются одной и той же функцией, и, поскольку функция случайно переключает другой элемент (панель) , функциональность не выполняется, так как два переключателя взаимно отменяют друг друга. Итак, мне нужен способ очистки всех ожидающих событий для элемента.

Answer 1

Используйте event.stopImmediatePropagation() в обработчике событий.

Описание : предотвращает выполнение остальных обработчиков и предотвращаетсобытие от пузырясь вверх по дереву DOM.

Документация: http://api.jquery.com/event.stopImmediatePropagation/

---

Что делать, если вы отслеживаете запуск событий и блокируете переключение вызова, если другой уже был вызван?

var called = false;

function handler() {
   if (!called) {
      called = true;
      $('#panel').toggle(1, function () { // change the duration to your liking
          called = false;
      });
   }
}

$('#a').blur(handler);
$('#b').click(handler);

Еще не тестировал, но я считаю, что это должно работать.

РЕДАКТИРОВАТЬ: Это работало нормально, но опять же, когда я тестировал оригинальный обработчик, я не получил поведение, которое вы сказаливы получили - обработчик вызывался только один раз, даже в описанной вами ситуации (сфокусированный ввод, нажмите «b»).Я тестировал его в FF 3.6, IE8 и Chrome 5.

Answer 2

Возможно, вы ищете event.preventDefault():

Если этот метод вызывается, действие по умолчанию для события не будет запущено.

Или, может быть, вам нужно .unbind() одно событие, а затем повторно связать его после того, как другое событие сработало.

.undelegate() может делать то, что вы после:

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