一直弄清楚这个效果如何实现,看了这篇博客的几行代码原来如此简单,就是利用了事件冒泡而已。

比如有个div其id为body,实现在div外点击隐藏,div内点击不隐藏,采用jQuery实现如下:

$("#body").click(function(e) {
$(this).show();
e.stopPropagation();
});
$(document).click(function(event) { $("#body").hide();
});

如果div内点击隐藏,可采用jQuery的触发事件

$(document).trigger("click");

转自:http://blog.csdn.net/fengshizty/article/details/42674707

[转]JQuery控制div外点击隐藏,div内点击不会隐藏的更多相关文章

  1. jquery实现除指定区域外点击任何地方隐藏DIV

    <!--弹出的表情选择框--> <div class="layui-input-block expression-box"> </div> &l ...

  2. 点击页面其它地方隐藏div所想到的jQuery的delegate

    在网页开发的过程中经常遇到的一个需求就是点击一div内部做某些操作,而点击页面其它地方隐藏该div.比如很多导航菜单,当菜单展开的时候,就会要求点击页面其它非菜单地方,隐藏该菜单. 先从最简单的开始, ...

  3. 由点击页面其它地方隐藏div所想到的jQuery的delegate

    对于这个问题一般有两种思路,这两种思路都会利用事件冒泡这一原理,想要详细了解Javascript事件机制可以看看JavaScript与HTML交互——事件,这不是本文重点,所以这里只是简单介绍一下事件 ...

  4. jquery点击非div区域隐藏div

    点击非div区域隐藏div,如图,点击圆的头像(.person-msg)弹出白色底框(.person-centre).点击圆头像以外的区域隐藏白色底框

  5. js或jquery实现点击某个按钮或元素显示div,点击页面其他任何地方隐藏div

    点击某个元素显示div,点击页面其他任何地方隐藏div,可用javascript和jquery两种方法实现: 一:javascript实现方法技巧<script>//定义stopPropa ...

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

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

  7. jquery点击其他地方隐藏div层的实现程序

    js代码 $(document).ready(function() { //语言头部的点击事件,显示语言列表 $(".language_selected").click(funct ...

  8. React 点击按钮显示div与隐藏div,并给div传children

    最近做了一个react的点击按钮显示与隐藏div的一个小组件: [筛选]组件FilterButton import React,{Component} from 'react'; import {re ...

  9. js简单显示和隐藏div,触发超链接,动态更改button值,setInterval()简单使用,jquery easyui弹出框简单使用 .

    js简单显示和隐藏div .<!DOCTYPE html> .<html> .<head> .<meta charset="UTF-8"& ...

随机推荐

  1. js Date 生成某年某月的天数

    $(function () { //构造一个日期对象: var day = new Date(2014, 2, 0); //获取天数: var daycount = day.getDate(); al ...

  2. js 去空格 和 获得字节数

    function removespace(str) { return str.replace(/(^\s*)|(\s*$)/g, ""); } function getLength ...

  3. 「POJ 2699」The Maximum Number of Strong Kings

    题目链接 戳我 \(Describe\) 一场联赛可以表示成一个完全图,点表示参赛选手,任意两点u, v之间有且仅有一条有向边\((u, v)\)或\((v, u)\),表示\(u\)打败\(v\)或 ...

  4. 201621123012 《java程序设计》第2周学习总结

    1. 本章学习总结 1.学习了java许多了基本语法,string函数,arraylist函数的各种功能方法和调用. 2.了解了除for循环之外的foreach循环 3.学习了各种数值类的包装 4.熟 ...

  5. 强制json格式

  6. 期待suqingnian.h

    不定期更新,跟着自己的进度走的. 有什么好的东西可以收录的尽管留言 UPD:话说真的没人发现本宝宝的$Martix$类的$operator$打错了么?$qwq$ $2018.7.19$ /*by Qi ...

  7. 关于执行webdriver.Chrome; 报错WebDriverException: Message: unknown error: Element is not clickable at point (1085, 103)

    from selenium import webdriverfrom time import sleep dr = webdriver.Chrome() dr.get("http://pj1 ...

  8. 为Arch Linux添加鼠标支持(gpm)

    gpm的安装 在Arch Linux中安装gpm $ pacman -S gpm 如果你正在使用触控板,需要安装一下插件 $ pacman -S gpm xf86-input-synaptics 需要 ...

  9. [Microsoft] 微软技术平台的Cloud Building平台AppVeyor

    Link: http://www.tuicool.com/articles/uMBZba http://www.appveyor.com/ 随着云技术的不断完善,基于云的应用越发丰富起来.AppVey ...

  10. 基于 Pymsql 数据库连接池

    helper.py import pymysql from settings import Config def connect(): conn = Config.POOL.connection() ...