如何实现检测点击区域是否在某个元素以外?
很多人都会像排名第一的答案那样做,如下:
$(window).click(function() {
//Hide the menus if visible
});
$('#menucontainer').click(function(event){
event.stopPropagation();
});
这却会导致一个问题:点击事件停止冒泡了,可能会使得其他程序无法知道事件的发生。
那么如何做能解决这个问题呢,答案如下:
$(document).on('click', function(event) {
if (!$(event.target).closest('#menucontainer').length) {
// Hide the menus.
}
});
document 监听了点击事件,判断 event target 是否是 #menucontainer 或父元素是 #menucontainer,如果不是,那你就可以知道点击区域在 #menucontainer 之外。