JQuery：除指定区域外点击任何地方隐藏DIV

最新推荐文章于 2022-08-10 20:02:18 发布

转载最新推荐文章于 2022-08-10 20:02:18 发布 · 2.2w 阅读

文章标签：

#jquery

JQuery 专栏收录该内容

10 篇文章

订阅专栏

本文介绍了一种通过监听页面点击事件来控制 Overlay 显示与隐藏的方法。具体实现中利用了 jQuery 的选择器来判断点击目标是否为指定元素，从而决定是否触发 Overlay 的隐藏动作。

$('body').click(function(e) {
    var target = $(e.target);
    // 如果#overlay或者#btn下面还有子元素，可使用
    // !target.is('#btn *') && !target.is('#overlay *')
    if(!target.is('#btn') && !target.is('#overlay')) {
       if ( $('#overlay').is(':visible') ) {  
            $('#overlay').hide();                                                    
       }
    }
});

或者

$('body').click(function(e) {
   if(e.target.id != 'btn' && e.target.id != 'overlay')
      if ( $('#overlay').is(':visible') ) {
         $('#overlay').hide();
      }
})