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

Question

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

Прямо сейчас в каждом событии я проверяю флаг, например:

var canClick = false; // Global flag

// Sample click event:
$("#someDiv").click(function(){
  if(!canClick) return;

  // Some stuff ...
});

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

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

Пример:

$("#someDiv").click(function(){ console.log("someDiv click"); });

$(document).click(function(){ console.log("Document click"); });

// When I click on the someDiv element it prints:
> someDiv click
> Document click

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

Могу ли я перезаписать функцию щелчка jQuery, чтобы я мог поставить свою небольшую проверку там?

Есть ли что-то очевидное, что я здесь упускаю?

Спасибо за любую помощь.

Answer 1

Да, используйте .addEventListener () и установите третий параметр на true .Это свяжет слушателя с фазой захвата и выполнит функцию, прежде чем что-либо еще будет выполнено.

Вот пример, где это остановит выполнение всех обработчиков щелчков:

document.addEventListener('click', function(e) {
    e.stopPropagation();
}, true);

См. Это вдействие здесь:

http://jsfiddle.net/wLwMh/1/

Answer 2

Вы можете захватить все события щелчка, а затем запустить пользовательское событие, к которому привязаны ваши слушатели после проверки

$("#someDiv").bind('awesomeEvent', function() {
    //do stuff here
}

$(*).click(function() {
    if(canClick) {
        $(this).trigger('awesomeEvent');
    }
}

РЕДАКТИРОВАТЬ. Следует отметить, что использование селектора $ (*) не очень хорошая идея.с точки зрения производительности.Вы должны действительно попытаться как-то сузить область.