jQuery实现点击div外的区域，来隐藏指定节点
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).bind('click', function(e) {
var e = e || window.event; //浏览器兼容性
var elem = e.target || e.srcElement;
while (elem) { //循环判断至跟节点，防止点击的是div子元素
if (elem.id && (elem.id == 'test' || elem.id == 'test2')) {
return;
}
elem = elem.parentNode;
}
$('#a').css('display', 'none'); //点击的不是div或其子元素
});
</script>
</head> <body>
<div id="a">
<div id="test" style="width: 300px; height: 300px; background-color: palegreen;">
</div>
<div id="test2" style="width:100px;height:100px;background:gold;">测试测试测试测试</div>
</div>
</body> </html>
jQuery实现点击div外的区域，来隐藏指定节点的更多相关文章
- jquery实现点击div外隐藏div
html <div style="width:100px;height:100px;border:1px solid #ff0" id="div"> ...
- 怎么点击div之外的区域就隐藏这个div啊 找了很久，都没有很好解决
方法一. <!DOCTYPE html><html><head><meta http-equiv="Content-Type" conte ...
- 设立点击ProgressDialog外的区域对话框不消失
设置点击ProgressDialog外的区域对话框不消失ProgressDialog mpDialog = new ProgressDialog(OrderTable.this); mpDialog ...
- jQuery实现鼠标点击div外的地方div隐藏消失的效果（转）
转:https://www.cnblogs.com/jsingleegg/p/3456152.html css部分: <style type="text/css">.p ...
- jQuery实现鼠标点击div外的地方div隐藏消失的效果
css部分: <style type="text/css"> .pop { width:200px; height:130px; background:#080;} & ...
- jquery点击div以外的区域触发事件
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- JQuery实现点击div以外的位置隐藏该div窗口
简单示例代码: <body> <script type="text/javascript" src="http://ajax.googleapis.co ...
- js构建函数，点击按钮显示div，再点击按钮或其他区域，隐藏div
这只是一个例子,先看看效果: html代码: <nav> <span class="nav_logo"></span> <h1>云蚂 ...
- jquery判断点击事件是否为指定区域
<script type="text/javascript"> $(document).click(function(e){ e = window.event || e ...
随机推荐
- P3381 【模板】最小费用最大流(spfa板子)
#include<bits/stdc++.h> using namespace std; #define lowbit(x) ((x)&(-x)) typedef long lon ...
- 预备JS执行环境，预执行脚本
page.evaluateOnNewDocument(pageFunction, ...args) pageFunction <function|string> Function to b ...
- 二十四 Redis消息订阅&事务&持久化
Redis数据类型: Redis控制5种数据类型:String,list,hash,set,sorted-set 添加数据,删除数据,获取数据,查看有多少个元素,判断元素是否存在 key通用操作 JR ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮：分割按钮
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- POJ 3050 Hopscotch 四方向搜索
Hopscotch Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 6761 Accepted: 4354 Descrip ...
- 记-ItextPDF+freemaker 生成PDF文件---导致服务宕机
摘要:已经上线的项目,出现服务挂掉的情况. 介绍:该服务是专门做打印的,业务需求是生成PDF文件进行页面预览,主要是使用ItextPDF+freemaker技术生成一系列PDF文件,其中生成流程有:解 ...
- impala invalidate metadata和impala-shell -r作用相同
impala的invalidate metadata内部命令,是否和外部命令impala-shell -r的作用相同的? 这个问题的回答: 在invalidate metadata 和 impala- ...
- 搭建python的开发环境（采用eclipse的开发工具）在线和离线安装pyDev
一.首先下载python的开发环境并安装 在这里下载python3.7.2,然后安装在一个指定文件夹,随后,将安装路径配置到环境变量中 验证是否成功 OK! 二.在线安装pyDev工具 三.导入开发环 ...
- Element 以二进制的形式 自定义上传图片
一,只有在上传文件之前的钩子函数中才可以获得最初的文件(文件本身的二进制形式),用以以上传服务器. 还需要使用formdata来承载数据,便于接收 <template> <div ...
- 01 vue入门
vue简介 官网上有介绍,这里粘出来 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心 ...