鼠标单击页面上的其他位置(而不是特定的div) [英] mouse click somewhere else on page (not on a specific div)

查看:182
本文介绍了鼠标单击页面上的其他位置(而不是特定的div)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

当用户点击页面上除框区域以外的任何位置时,我想在页面中关闭一个小弹出框。如何找到它?

I want to close a little pop-up box in page when user has clicked anywhere on the page other than box area. how to find it?

推荐答案

$(document.body).click(function(e){
   var $box = $('#little-pop-up-box-id');
   if(e.target.id !== 'little-pop-up-box-id' && !$.contains($box[0], e.target))
      $box.remove();
});

e.target DOM节点收到点击事件。我首先检查该元素的 ID 是否不是我们正在寻找的那个。

e.target is the DOM node which received the click event. I'm checking first if the ID of that element is not the one we are looking for.

第二次检查!$。contains($ box [0],e.target)确保 DOM节点调用不是 我们要隐藏的元素。

The second check !$.contains($box[0], e.target) makes sure, that the DOM node of invocation is not within the element we want to hide.

嗯,我猜这是插件时间! :

Well, I guess it's plugin time! :

(function($){
   $.fn.outside = function(ename, cb){
      return this.each(function(){
         var $this = $(this),
              self = this;
         $(document.body).bind(ename, function tempo(e){
             if(e.target !== self && !$.contains(self, e.target)){
                cb.apply(self, [e]);
                if(!self.parentNode) $(document.body).unbind(ename, tempo);
             }
         });
      });
   };
}(jQuery));

简介

$('#container').outside('click', function(e){
    $(this).remove();
});

示例:

http://www.jsfiddle.net/qbDKN/30/

这篇关于鼠标单击页面上的其他位置(而不是特定的div)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆