<style type="text/css">
.pop {
display:none;
width: 200px;
height: 130px;
background: #080;
}
</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$("#clickBtn").click(function(){
$(".pop").show();
});
$(document).bind("click",function(e){
var target  = $(e.target);
if(target.closest(".pop,#clickBtn").length == 0){/*.closest()沿 DOM 树向上遍历,直到找到已应用选择器的一个匹配为止,返回包含零个或一个元素的 jQuery 对象。*/
$(".pop").hide();
};
e.stopPropagation();
})
})
</script>

jquery 点击空白处隐藏div元素的更多相关文章

  1. 锋利的Jquery(点击显示隐藏div)

    点击显示隐藏div <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

  2. Jquery点击除了指定div元素其他地方,隐藏该div

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script ty ...

  3. 点击空白处隐藏div

    class="bigPic"的div是被显示或隐藏的div,另外.case > ul > li是class="bigPic"的父级元素 $(&quo ...

  4. jquery实现点击按钮弹出层和点击空白处隐藏层

    昨天做项目遇到一个问题,和大家分享下,jquery实现点击按钮弹出层和点击空白处隐藏层的问题 if($('.autoBtn').length){                $('.autoBtn' ...

  5. react 点击空白处隐藏弹出层

    点击空白处隐藏弹出层的原理是:在 document 上绑定事件来隐藏弹出层,这样点击任何元素的时候都会冒泡到 document 上,都会执行隐藏弹出层的功能.然后我们在不需要隐藏弹出层的元素上阻止冒泡 ...

  6. IOS 点击空白处隐藏键盘的几种方法

    IOS 点击空白处隐藏键盘的几种方法     IOS7 点击空白处隐藏键盘的几种方法   IOS开发中经常要用到输入框,默认情况下点击输入框就会弹出键盘,但是必须要实现输入框return的委托方法才能 ...

  7. IOS7 点击空白处隐藏键盘的几种方法

    IOS7 点击空白处隐藏键盘的几种方法   iOS开发中经常要用到输入框,默认情况下点击输入框就会弹出键盘,但是必须要实现输入框return的委托方法才能取消键盘的显示,对于用户体验来说很不友好,我们 ...

  8. IOS Swift UITableViewcontroller实现点击空白处隐藏键盘

    在ios开发中,为了方便,我们经常使用UITableViewcontroller,比如搜索界面为了方便可能更多的使用UITableViewcontroller,那么问题就来了,当我点击搜索框的时候会弹 ...

  9. 【Flutter 实战】全局点击空白处隐藏键盘

    老孟导读:为什么要实现点击空白处隐藏键盘?因为这是 iOS 平台的默认行为,Android 平台由于其弹出的键盘右上角默认带有关闭键盘的按钮,所以点击空白处不会隐藏键盘. 对于单个页面来说,通过为 T ...

随机推荐

  1. Flex httpservice返回值类型和处理 (转)

    这两天在考虑flex与后端java服务交互的问题.在采用BlazeDS的Remote Object方式,还是传统的http service方式之间徘徊了一段时间 采用BlazeDS的Remote Ob ...

  2. mysql中datetime比较大小问题 (转的)

    方法一: 你也可以:select * from t1 where unix_timestamp(time1) > unix_timestamp('2011-03-03 17:39:05') an ...

  3. FileUpload上传图片直接浏览显示(没有上传按钮如何上传)

    1.给FileUpload添加一个onchange事件:FileUpload1.Attributes.Add("onchange", "document.getEleme ...

  4. hdu Turn the corner

    这题是道三分的题,首先要分析满足条件的情况,这个就是平面几何的功夫了.要想车子能够转弯成功,最上面那个点到水平线的距离要小于等于y.这里h和s的公式就是利用平面几何的知识求出来的:s=l*cos(a) ...

  5. Twemproxy 介绍与使用

    Twemproxy是一种代理分片机制,由Twitter开源.Twemproxy作为代理,可接受来自多个程序的访问,按照路由规则,转发给后台的各个Redis服务器,再原路返回.该方案很好的解决了单个Re ...

  6. [ZZ] The Naked Truth About Anisotropic Filtering

    http://www.extremetech.com/computing/51994-the-naked-truth-about-anisotropic-filtering In the seemin ...

  7. Nginx 笔记与总结(9)rewrite 重写规则

    重写的规则可以放在 serverer 里,也可以放在 location 里. rewrite 规则: 常用的命令有 ① if(条件){} 设定条件,再进行重写 if 语法: if 空格 (条件){   ...

  8. etcdctl --help

    NAME:   etcdctl - A simple command line client for etcd. USAGE:   etcdctl [global options] command [ ...

  9. placeholder属性实现text标签默认值提示用户

    <input type="text" class="searchTxt" id=this.id+"-searchTxt" placeh ...

  10. css修改,类似elememt.style样式修改

    使用!important 语法优先权. .yui-b { margin-left:0px ! important; }