jQuery:陷阱所有点击事件发生之前?

时间:2011-05-27 20:41:39

标签: jquery events click propagation

在我的页面上,我有很多可以响应点击事件的元素。 有时我需要根据某些全局标志来阻止所有点击。 有没有办法在集中的位置进行检查?

现在我在每个事件中检查标志,例如:

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传播。此外,我不想依赖于创建额外的元素来捕获点击,因为它感觉有点hacky。

我可以覆盖jQuery点击功能,以便我可以把我的小支票放在那里吗?

这里有什么显而易见的东西吗?

感谢您的帮助。

3 个答案:

答案 0 :(得分:24)

是的,使用.addEventListener()并将第3个选项设置为 true 。这会将侦听器绑定到捕获阶段,并在执行任何其他操作之前执行该函数。

这是一个示例,它将阻止所有点击处理程序执行:

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

请在此处查看:

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

答案 1 :(得分:0)

您可以捕获所有点击事件,然后触发自定义事件,您可以在检查后绑定侦听器

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

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

EDIT 我应该提一下,从性能的角度来看,使用$(*)选择器并不是一个好主意。你应该以某种方式尝试缩小范围。

答案 2 :(得分:0)

使用注入Javascript:

FORM