[转]JQuery控制div外点击隐藏,div内点击不会隐藏
一直弄清楚这个效果如何实现,看了这篇博客的几行代码原来如此简单,就是利用了事件冒泡而已。
比如有个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内点击不会隐藏的更多相关文章
- jquery实现除指定区域外点击任何地方隐藏DIV
<!--弹出的表情选择框--> <div class="layui-input-block expression-box"> </div> &l ...
- 点击页面其它地方隐藏div所想到的jQuery的delegate
在网页开发的过程中经常遇到的一个需求就是点击一div内部做某些操作,而点击页面其它地方隐藏该div.比如很多导航菜单,当菜单展开的时候,就会要求点击页面其它非菜单地方,隐藏该菜单. 先从最简单的开始, ...
- 由点击页面其它地方隐藏div所想到的jQuery的delegate
对于这个问题一般有两种思路,这两种思路都会利用事件冒泡这一原理,想要详细了解Javascript事件机制可以看看JavaScript与HTML交互——事件,这不是本文重点,所以这里只是简单介绍一下事件 ...
- jquery点击非div区域隐藏div
点击非div区域隐藏div,如图,点击圆的头像(.person-msg)弹出白色底框(.person-centre).点击圆头像以外的区域隐藏白色底框
- js或jquery实现点击某个按钮或元素显示div,点击页面其他任何地方隐藏div
点击某个元素显示div,点击页面其他任何地方隐藏div,可用javascript和jquery两种方法实现: 一:javascript实现方法技巧<script>//定义stopPropa ...
- 锋利的Jquery(点击显示隐藏div)
点击显示隐藏div <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...
- jquery点击其他地方隐藏div层的实现程序
js代码 $(document).ready(function() { //语言头部的点击事件,显示语言列表 $(".language_selected").click(funct ...
- React 点击按钮显示div与隐藏div,并给div传children
最近做了一个react的点击按钮显示与隐藏div的一个小组件: [筛选]组件FilterButton import React,{Component} from 'react'; import {re ...
- js简单显示和隐藏div,触发超链接,动态更改button值,setInterval()简单使用,jquery easyui弹出框简单使用 .
js简单显示和隐藏div .<!DOCTYPE html> .<html> .<head> .<meta charset="UTF-8"& ...
随机推荐
- MongoDB整理笔记のReplica oplog
主从操作日志oplog MongoDB的Replica Set架构是通过一个日志来存储写操作的,这个日志就叫做"oplog".oplog.rs是一个固定长度的capped coll ...
- C#多线程编程实战1.7前台线程和后台线程
using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threa ...
- vs2015+opencv3.3.1 实现 c++ 彩色高斯滤波器(Gaussian Smoothing, Gaussian Blur, Gaussian Filter)
//高斯滤波器 https://github.com/scutlzk#include <opencv2\highgui\highgui.hpp> #include <iostream ...
- 20165219 2017-2018-2 《Java程序设计》第7周学习总结
20165219 2017-2018-2 <Java程序设计>第7周学习总结 课本知识总结 第11章 JDBC与MySQL数据库 连接数据库 1下载JDBC-MySQL数据库驱动 2 加载 ...
- 题解 CF500D 【New Year Santa Network】
题目链接 这道题首先是要看看该如何化简,先把三元组化成二元组. 之后统计经过某条边的 次数$*$权值 的和. 最后除以总基数 $tot$ 其中,每条边被计算的次数为 子树的点数$*$非子树的点数 ( ...
- Spark JavaRDD、JavaPairRDD、Dataset之间的相互转换
主要内容: 1. JavaRDD to JavaPairRDD 2. Dataset to JavaPairRDD 3. JavaPairRDD to JavaRDD 4. JavaRDD to Da ...
- postgreSQL PL/SQL编程学习笔记(二)
Control Structures of PL/SQL Control structures are probably the most useful (and important) part of ...
- 创建Oracle synonym 详解
--创建使用同义词 --同义词就是给表.视图等对象取得别名,用于简化对其的访问 --分为2种: --私有同义词:用户自己创建自己使用的 --公共同义词:dba创建,给其它用户使用的 --为dept_s ...
- Array数组结构底层实现复习
Array数组结构底层实现复习 内容待总结: size capacity length
- SDUT OJ 数据结构实验之图论十:判断给定图是否存在合法拓扑序列
数据结构实验之图论十:判断给定图是否存在合法拓扑序列 Time Limit: 1000 ms Memory Limit: 65536 KiB Submit Statistic Discuss Prob ...