怎么点击div之外的区域就隐藏这个div啊 找了很久，都没有很好解决
方法一.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<span onClick="with(document.getElementById('pop')){style.display='';tabIndex = 1;focus();}" style="color:#F00">打开层</span>
<div>aaaaaaaaaaaa</div>
<div>aaaaaaaaaaaa</div>
<div>aaaaaaaaaaaa</div>
<div>aaaaaaaaaaaa</div>
<div>aaaaaaaaaaaa</div>
<div>aaaaaaaaaaaa</div>
<div id="pop" hidefocus="true" onblur="this.style.display='none';" style="border:#000; background-color:#CCC; position:absolute; left:50px; top:50px;width:200px;height:200px; display:none">浮层，点击这个浮层以外的区域，都可以隐藏这个浮层，怎么做啊，多谢了</div>
</body>
</html>
方法二。
<!DOCTYPE html>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>蚂蚁部落</title>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(function() {
$(".a").on("click", function(e) {
if ($(".menu").is(":hidden")) {
$(".menu").show();
} else {
$(".menu").hide();
}
$(document).one("click", function() {
$(".menu").hide();
});
e.stopPropagation();
});
$(".menu").on("click", function(e) {
e.stopPropagation();
});
})
</script>
</head>
<body>
<p>
<a href="javascript:void(0)" class="a">菜单按钮</a>
</p>
<div class="menu">
<a href="http://www.baidu.com">百度</a>
</div>
</body>
</html>
怎么点击div之外的区域就隐藏这个div啊 找了很久，都没有很好解决的更多相关文章
- Jquery点击除了指定div元素其他地方，隐藏该div
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script ty ...
- js构建函数，点击按钮显示div，再点击按钮或其他区域，隐藏div
这只是一个例子,先看看效果: html代码: <nav> <span class="nav_logo"></span> <h1>云蚂 ...
- js实现的点击div区域外隐藏div区域
首先看下JS的事件模型,JS事件模型为向上冒泡,如onclick事件在某一DOM元素被触发后,事件将跟随节点向上传播,直到有click事件绑定在某一父节点上,如果没有将直至文档的根. 阻止冒泡:1.对 ...
- 点击区域外隐藏该区域，event.stopPropagation()
event.stopPropagation() Description: Prevents the event from bubbling up the DOM tree, preventing an ...
- 点击页面其它地方隐藏该div的两种思路
思路一 第一种思路分两步 第一步:对document的click事件绑定事件处理程序,使其隐藏该div 第二步:对div的click事件绑定事件处理程序,阻止事件冒泡,防止其冒泡到document,而 ...
- 点击页面其它地方隐藏该div的方法
思路一 第一种思路分两步 第一步:对document的click事件绑定事件处理程序,使其隐藏该div 第二步:对div的click事件绑定事件处理程序,阻止事件冒泡,防止其冒泡到document,而 ...
- js实现点击按钮时显示弹框，点击按钮及弹框以外的区域时隐藏弹框
转自https://blog.csdn.net/yimawujiang/article/details/86496936 问题:js实现点击按钮时显示弹框,点击按钮及弹框以外的区域时隐藏弹框? 方案一 ...
- jquery点击元素之外触发事件
$("#errorMsg_layer").bind("click",function(e){ if($(e.target).closest("#err ...
- 设立点击ProgressDialog外的区域对话框不消失
设置点击ProgressDialog外的区域对话框不消失ProgressDialog mpDialog = new ProgressDialog(OrderTable.this); mpDialog ...
随机推荐
- sublime + emmet(Zen Coding)
今天接触sublime这个编辑器,一下子就喜欢上它了,以前我一直使用NOTEPAD++,果断换上sublime玩玩,呵呵 编辑功能啥的没话,作为前端开发的话,和emmet(原名叫Zen Coding) ...
- Linux最大打开文件描述符数
1. 系统最大打开文件描述符数:/proc/sys/fs/file-max a. 查看 $ cat /proc/sys/fs/file-max 186405 2. 设置 a. 临时性 ...
- 【重要】U3D存放本地游戏存档——不同平台载入XML文件的方法——IOS MAC Android
在PC上和IOS上读取XML文件的方式略有差别,经测试,IOS上不支持如下方法载入XML文件: XmlDocument xmlDoc = new XmlDocument(); xmlDoc.Load( ...
- .NET批量数据入库
/// <summary> /// 批量写入数据库 /// </summary> /// <param name="urlInfo">Url类& ...
- print($arr,true)的参数true表示将$arr的值返会，而不是打印
之前通过error_log()来调试php, 发现收到的json字符前边总是有一个1,一直以为是哪里直接出现了print.print_r.echo.var_dump(), 后来发现原来是某处用了形如e ...
- 【.netcore基础】MVC制器Controller依赖注入
废话少说,直接上代码 首先我们得有一个接口类和一个实现类,方便后面注入MVC里 接口类 public interface IWeatherProvider { List<WeatherForec ...
- java高级---->Thread之单例模式的使用
这里我们介绍一下在多线程中如何安全正确的编写单例模式的代码.不知为何,恰如其分的话总是姗姗来迟,错过最恰当的时机. 多线程中的单例模式 这里面通过代码来体会一下在多线程中如何正确的编写单例模式的代码. ...
- 【Java基础】System的arraycopy方法拷贝数组
一.在System类中查看方法的定义 二.示例 public class SystemArrayCopyTest { /** * @Description: System的arrayCopy方法测试 ...
- 解决：SqlDateTime 溢出。必须介于 1/1/1753 12:00:00 AM 和 12/31/9999 11:59:59 PM 之间提示问题
提示信息如下 “/”应用程序中的服务器错误. SqlDateTime 溢出.必须介于 1/1/1753 12:00:00 AM 和 12/31/9999 11:59:59 PM 之间. 问题现象: 问 ...
- windows下php使用protobuf
1.下载protobufc https://github.com/google/protobuf/releases/download/v3.5.0/protoc-3.5.0-win32.zip解压后放 ...