转:https://www.cnblogs.com/jsingleegg/p/3456152.html

css部分:

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

样式与JS部分:

<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);

// 判断有没有这个class
          if(target.closest(".pop").length == 0){
               $(".pop").hide();
            }    
       })
    })
  </script>

<div class="pop"></div>

点击空白的地方指定div 隐藏消失了
</body>

jQuery实现鼠标点击div外的地方div隐藏消失的效果(转)的更多相关文章

  1. 使用JS或jQuery模拟鼠标点击a标签事件代码

    原文 使用JS或jQuery模拟鼠标点击a标签事件代码 这篇文章主要介绍了使用JS或jQuery模拟鼠标点击a标签事件代码,需要的朋友可以参考下 <a id="alink" ...

  2. jQuery实现鼠标点击div外的地方div隐藏消失的效果

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

  3. jQuery实现鼠标点击Div区域外隐藏Div

    冒泡定义:当一个元素上的事件被触发的时候,比如说鼠标点击了一个按钮,同样的事件将会在那个元素的所有祖先元素中被触发.这一过程被称为事件冒泡:这个事件从原始元素开始一直冒泡到DOM树的最上层.(摘自网络 ...

  4. jquery 实现鼠标点击div盒子移动功能

    // Start 窗口的拖动 var _move=false; //移动标记 var _x,_y; //鼠标离控件左上角的相对位置 $(document).ready(function(){ $(&q ...

  5. 使用JS或jQuery模拟鼠标点击a标签事件

    <a id="alink" href="abc.aspx"  style="visibility: hidden;">下一步&l ...

  6. 使用jQuery模拟鼠标点击a标签事件

    来源于:https://mo2g.com/view/42/ <html> <head> <meta charset="UTF-8"> <t ...

  7. 鼠标点击input时,placeholder中的提示信息消失

    html代码: <input type="text" placeholder="多个关键词空格隔开"> 鼠标点击input时,placeholder ...

  8. (转载)Unity UGUI鼠标点击UI不受影响方法IsPointerOverGameObject

    这几天在做捕鱼达人游戏时发现,当鼠标点击UI时,炮台的子弹也会发射子弹,这样会影响用户体验. 然后网上百度了一波,发现在UGUI系统上,EventSystem提供了一些方法.那就是EventSyste ...

  9. Teamviewer 远程控制时 无法正常操作鼠标点击

    其中一种可能: 本机开启了360的64位Intel-VT核晶防护后,用Teamviewer远程到本机,远程电脑无法操作本机的鼠标点击(左右键都不行),查看日志显示拦截了模拟按键.关闭核晶防护就可以正常 ...

随机推荐

  1. termios结构体各成员的值(FreeBSD 12.0)

    一.文件位置 /usr/include/sys/_termios.h 二.文件内容 /*- * SPDX-License-Identifier: BSD-3-Clause * * Copyright ...

  2. Javaweb学习笔记——(十七)——————JDBC的原理、四大核心类、四大参数、预编译、Dao模式、批处理、大数据、时间类型的转换

    JDBC入门 *导入jar包:驱动 *加载驱动类:Class.forName("类名"); *给出url.username.password,其中url背下来 *使用DriverM ...

  3. ****** 四十二 ******、软设笔记【网络基础】-IPv6协议、常用的网络协议

    一.IPv6协议 IPv6协议,全称"互联网协议第6版",即下一代的网际协议. 相对于IPv4来说,IPv6协议主要改进: *扩展的地址.IPv6地址长度为128位. *IPv6使 ...

  4. python中的optionParser模块

    Python 有两个内建的模块用于处理命令行参数:一个是 getopt,<Deep in python>一书中也有提到,只能简单处理 命令行参数:另一个是 optparse,它功能强大,而 ...

  5. phpcms中set_config和get_sysinfo函数

    /** * 设置config文件 * @param $config 配属信息 * @param $filename 要配置的文件名称 */ function set_config($config, $ ...

  6. 最小生成树入门(克鲁斯卡尔+普利姆 hdu1233)

    克鲁斯卡尔 #include <set> #include <map> #include <queue> #include <stack> #inclu ...

  7. 【vue】中 $parent 和 $children 的使用方法

    <div id="app"> A{{msg}} <my-button :msg="msg"></my-button> < ...

  8. 如何快速上手一个新技术之vue学习经验

    碰到紧急项目挪别人的vue项目过来直接改,但是vue是18年初看过一遍,18年底再来用,早就忘到九霄云外了,结果丢脸的从打开vue开始学,虽然之前在有道云笔记做了很多记录,然后没有系统整理.所以借这次 ...

  9. 【blog】mysql字段类型datetime和timestamp的区别

    首先 DATETIM和TIMESTAMP类型所占的存储空间不同,前者8个字节,后者4个字节,这样造成的后果是两者能表示的时间范围不同.前者范围为1000-01-01 00:00:00 ~ 9999-1 ...

  10. [kuangbin带你飞]专题一 简单搜索(回顾)

    A - 棋盘问题 POJ - 1321 注意条件:不能每放一个棋子,就标记一行和一列,我们直接枚举每一行就可以了. AC代码: #include<iostream> #include< ...