捕获 DOM 元素外部的点击

Posted 2023-05-09

技术标签:

【中文标题】捕获 DOM 元素外部的点击【英文标题】：Capturing clicks outside DOM element 【发布时间】：2014-10-18 11:32:51 【问题描述】：

我想捕获 html 标记之外的点击。例如我有这个 HTML：

<body> 
 <div>
  <ul>
   <li id="button">
   </li>
  </ul>
 </div>
</body>

#button 是页面中间的最小方块。一旦用户在外面点击，就会发生什么，点击里面，什么都不会发生。

由于事件传播，这个 JS 不起作用：

jQuery('*').not('li#button').click(...);

所以我的点击事件最终会在触发事件的 ul、div 和 body 上触发。我不能用这个：

jQuery('*').click(function(e) 
 e.stopPropagation();
 if(e.(...)) 
)

因为页面上的其他事件停止工作。

实现这一目标的其他方法是什么？

【问题讨论】：

How to detect a click outside an element?的可能重复 【参考方案1】：

$(document).bind('click', function(e) 
    if($(e.target).closest('#button').length == 0) 
        // yourlogic
    
);

同时检查How to detect a click outside an element?

【讨论】：

【参考方案2】：

$(document).click(function(e)
e.stopPropagation();
if($(e.Target).attr(id) != "button")
    // Your logic
    
);

【讨论】：

下次请解释您的答案并正确格式化您的代码

以上是关于捕获 DOM 元素外部的点击的主要内容，如果未能解决你的问题，请参考以下文章