javascript - 使用javascript检测div外部的点击

Question

我想检测 div 区域内部或外部的点击。棘手的部分是 div 将包含其他元素，如果单击 div 内的一个元素，则应将其视为内部单击，同样，如果单击 div 外部的元素，则应将其视为外部单击单击。

我做了很多研究，但我能找到的只是 jquery 中的示例，而我需要纯 JavaScript。

如有任何建议，我们将不胜感激。

Answer 1

这取决于具体的用例，但听起来在这个例子中主 div 内可能还有其他嵌套元素，例如更多 div、列表等。使用 Node.contains将是检查目标元素是否位于正在检查的 div 内的有用方法。

window.addEventListener('click', function(e){   
  if (document.getElementById('clickbox').contains(e.target)){
    // Clicked in box
  } else{
    // Clicked outside the box
  }
});

内部有嵌套列表的示例是 here .