我需要捕获一个事件而不是让它冒泡。这就是我要的：
<body>
<div>
</div>
</body>
在这个示例代码中，我有一个以 div 和 body 为界的点击事件。我希望首先调用 body 事件。我该怎么做？
事件捕获 jQuery
IT技术
javascript
jquery
2021-03-09 08:19:00
3个回答
改用事件捕获：-
$("body").get(0).addEventListener("click", function(){}, true);
检查“addEventListener”的最后一个参数默认情况下它是假的并且处于事件冒泡模式。如果设置为 true 将用作捕获事件。
用于跨浏览器实现。
var bodyEle = $("body").get(0);
if(bodyEle.addEventListener){
bodyEle.addEventListener("click", function(){}, true);
}else if(bodyEle.attachEvent){
document.attachEvent("onclick", function(){
var event = window.event;
});
}
IE8 和之前的默认情况下使用事件冒泡。所以我将事件附加在文档而不是正文上，因此您需要使用事件对象来获取目标对象。对于 IE，您需要非常棘手。
我会这样做：
$("body").click(function (event) {
// Do body action
var target = $(event.target);
if (target.is($("#myDiv"))) {
// Do div action
}
});
比@pvnarula 的回答更普遍：
var global_handler = function(name, handler) {
var bodyEle = $("body").get(0);
if(bodyEle.addEventListener) {
bodyEle.addEventListener(name, handler, true);
} else if(bodyEle.attachEvent) {
handler = function(){
var event = window.event;
handler(event)
};
document.attachEvent("on" + name, handler)
}
return handler
}
var global_handler_off = function(name, handler) {
var bodyEle = $("body").get(0);
if(bodyEle.removeEventListener) {
bodyEle.removeEventListener(name, handler, true);
} else if(bodyEle.detachEvent) {
document.detachEvent("on" + name, handler);
}
}
然后使用：
shield_handler = global_handler("click", function(ev) {
console.log("poof")
})
// disable
global_handler_off("click", shield_handler)
shield_handler = null;