事件捕获jQuery
我需要捕捉一个事件，而不是让它冒泡。 这是我想要的：
<body> <div> </div> </body> 从这个示例代码，我有一个单击事件绑定在div和body上。 我希望身体事件先被调用。 我如何去做这件事？
使用事件捕获，而不是： –
$("body").get(0).addEventListener("click", function(){}, true);
检查最后一个参数为“addEventListener”，默认为false，并处于事件冒泡模式。 如果设置为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和之前默认使用事件冒泡。 所以我把事件附加在文档而不是body上，所以你需要使用event对象来获取目标对象。 对于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;
