<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>jqeury点击空白关闭弹窗</title> 
<style type="text/css"> 
.pop { width:200px; height:130px; background:#080;} 
</style> 
</head>

<body> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
<script type="text/javascript"> 
$(function(){ 
$(document).bind("click",function(e){ 
var target = $(e.target); 
if(target.closest(".pop").length == 0){ 
$(".pop").hide(); 
} 
}) 
}) 
</script> 
<div class="pop"></div> 
点击空白的地方指定div 隐藏消失了 
</body> 
</html>

jqeury点击空白关闭弹窗的更多相关文章

  1. 关于点击空白关闭弹窗的js写法推荐

    $(document).mouseup(function(e){ var _con = $(' 目标区域 '); // 设置目标区域 if(!_con.is(e.target) && ...

  2. 关于点击空白关闭弹窗的js写法推荐？

    $(document).mouseup(function(e){ var _con = $(' 目标区域 '); // 设置目标区域 ){ // Mark 1 some code... // 功能代码 ...

  3. 使用js冒泡实现点击空白处关闭弹窗

    什么是事件冒泡? 如图:在一个对象上触发某类事件(比如单击onclick事件),这个事件会向这个对象的父级对象传播,从里到外,直至它被处理(父级对象所有同类事件都将被激活),或者它到达了对象层次的最顶 ...

  4. Flex里监听mouseDownOutside事件解决弹出窗口点击空白关闭功能

    其实当用户在使用 PopUpManager 打开的某个组件外部单击时,会从该组件分派一个mouseDownOutside事件 监听该事件就能实现点击空白处关闭窗口的功能 this.addEventLi ...

  5. vue 点击按钮弹窗，点击关闭按钮关闭弹窗。

    <div @click="btnfc()">点击弹窗按钮</div> <div v-show="show"> <div ...

  6. 【vue】vue +element 搭建项目，点击空白处关闭弹窗

    <template> <div class="step2"> <el-button @click="togglePanel($event)& ...

  7. Bootstrap 模态框 禁止点击空白关闭模态框事件

    在模态框的div中加上 aria-hidden="true" data-backdrop="static" <div class="modal ...

  8. 实例：vue中点击空白区域关闭某个div图层

    <template> <div class="search" ref="searchMain"> <el-input v-mode ...

  9. 【转】Android点击空白区域，隐藏输入法软键盘

    原文网址:http://www.2cto.com/kf/201505/401382.html 很多时候,我们在使用应用时,会出现输入法软键盘弹出的问题,通常情况下,我们默认会使用户点击返回键或者下一步 ...

随机推荐

  1. RestTemplate发送请求并携带header信息 RestTemplate post json格式带header信息

    原文地址:  http://www.cnblogs.com/hujunzheng/p/6018505.html RestTemplate发送请求并携带header信息   v1.使用restTempl ...

  2. Eclipse创建第一个Spring Boot项目

    一.安装SpringBoot插件 安装过程需要联网下载插件,属于在线安装,请耐心等待安装完成,下载安装完成以后,需要重启Eclipse 二.创建Spring Boot项目 如下图所示new-other ...

  3. 构建分布式Tensorflow模型系列:CVR预估之ESMM

    https://zhuanlan.zhihu.com/p/42214716 本文是“基于Tensorflow高阶API构建大规模分布式深度学习模型系列”的第五篇,旨在通过一个完整的案例巩固一下前面几篇 ...

  4. CentOS7 使用yum命令安装Java SDK(openjdk)

    CentOS 6.X 和 7.X 自带有OpenJDK runtime environment  (openjdk).它是一个在linux上实现开源的java 平台. 安装方式: 1.输入以下命令,以 ...

  5. RobotFrameWork接口设计规范

    1. 前言 继前面一章<RobotFramework环境搭建>介绍了在本地如何将接口自动化实施过程所需要的基础环境搭建好,在这里假设大家都已经知道环境如何搭建了,如果不清楚的可直接查看上一 ...

  6. lua变量作用域

    3.5 – Visibility Rules Lua is a lexically scoped language. The scope of a local variable begins at t ...

  7. RabbitMQ五种消息队列学习（三）–Work模式

    由于在实际应用中,简单队列模型无法解决很多实际问题,而且生产者和消费者是一对一的关系.模型较为单一.故引入Work模式. 结构图 一个生产者.多个消费者. 一个消息只能被一个消费者获取. 测试实现:  ...

  8. Python源码中的PyCodeObject

    1.Python程序的执行过程 Python解释器(interpreter)在执行任何一个Python程序文件时,首先进行的动作都是先对文件中的Python源代码进行编译,编译的主要结果是产生的一组P ...

  9. linux 命令之top

    top命令是显示当前系统正在执行的进程相关信息.包含进程ID.内存占用率等:top命令格式例如以下: top [OPTIONS] OPTIONS: -b 批处理 -c 显示进程的完整名 -I 忽略失效 ...

  10. php位运算 与 或 异或 取反

    <?php /** php中有4个位运算,分别是&与 |或 ^异或 ~取反 & 两位全为1,结果为1 | 有一位为1,结果为1 ^ 一个为0,一个为1,结果为1 ~ 取反0-&g ...