仅在单击元素时触发事件,而不在其子元素上触发事件

Question

如果我将click处理程序绑定到body元素,当我单击页面上的任何内容时,将触发事件.我可以检查event.target每次点击:

$("body").on("click", function(event) {
  if (event.target.tagName == "BODY") {
    ...
  }
});

但这似乎有点矫枉过正.有没有办法只在单击身体的空白区域时触发事件？

Answer 1

您可以使用eventPhase事件的属性.值2表示事件当前正在触发目标元素:

$("body").on("click", function(event) {
    //Cancel if not at target
    if (event.eventPhase != 2) return;

    //Other Code Here
});