<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. Highcharts 本地导出图片 Java

    下载的Highcharts-2.3.5.zip 解压后 有 E:\Highcharts\Highcharts-2.3.5\exporting-server\java 目录 提供了Java实现的导出应用 ...

  2. 服务器文件系统一定要用NTFS格式。

    网络中心通过ADSL接入Internet(固定的IP地址), 网站服务通过端口映射放到了内网的两台计算机上,一台IP地址为122.9.6.1,提供Web.FTP.POP3与SMTP服务:另一台IP地址 ...

  3. 如何用JavaScript在页面上显示一个时间钟表

    <html><head><script type="text/javascript">function myTime(){var today=n ...

  4. c++ windows 获取mac地址

    c++ windows 获取mac地址 GetAdaptersInfo 用windows api获取mac地址和硬盘id编号 aa

  5. NV SDK 9.5, 10 and 11

    NVIDIA SDK 10   Overview This all-new collection of DirectX 10 and OpenGL code samples teaches devel ...

  6. RDBMS vs. NoSQL 合作还是竞争

    欢迎转载,转载请注明出处,徽沪一郎. 由于近期手头的工作和数据库的选型相关,纠结于是否使用一款NoSQL数据库来替换已有的MySQL数据库.在这个过程中随着学习研究的深入,对于二者的异同有了一些初步的 ...

  7. PHP 防止表单重复提交

    原理是:首先在表单页生成一个 随机不重复的 token(可以利用时间戳),把 token 的值分别存入 session 和 表单的隐藏域:当提交表单的时候,在接收页对比传递过来的 token 和ses ...

  8. web-content和web-info目录问题

    1.资源文件只能放在WebContent下面,如 CSS,JS,image等.放在WEB-INF下引用不了. 2.页面放在WEB-INF目录下面,这样可以限制访问,提高安全性.如JSP,html 3. ...

  9. centos7 安装mysql5.7及配置

    一.Mysql 各个版本区别:1.MySQL Community Server 社区版本,开源免费,但不提供官方技术支持.2.MySQL Enterprise Edition 企业版本,需付费,可以试 ...

  10. 推荐的PHP编码规范

    推荐的PHP编码规范 发布时间: 2014-05-7 浏览次数:2754 分类: PHP教程 推荐的PHP编码规范 一 编辑器设置 1. 使用Tab缩进,不要使用空格 鉴于很多编辑器在保存文件时会自动 ...