怎么点击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 ...
随机推荐
- SpringBoot------使用Fastjson解析Json数据
方法一: 1.在pom.xml文件下添加依赖包 <dependency> <groupId>com.alibaba</groupId> <artifactId ...
- SpringMVC由浅入深day01_12参数绑定(12.1参数绑定过程_12.2默认支持的类型_12.3简单类型)
12 参数绑定 处理器适配器在执行Handler之前需要把http请求的key/value数据绑定到Handler方法形参数上. 注解适配器对RequestMapping标记的方法进行适配,对方法中的 ...
- 7 -- Spring的基本用法 -- 7... 创建Bean的3种方式
7.7 创建Bean的3种方式 ① 调用构造器创建Bean. ② 调用静态工厂方法创建Bean. ③ 调用实例工厂方法创建Bean. 7.7.1 使用构造器创建Bean实例. 使用构造器来创建Bean ...
- C#中的Abstract、Virtual、Interface理解
容易混淆是必须的,都是与继承有关系,并且涉及到override的使用 一.Virtual方法(虚方法) virtual 关键字用于在基类中修饰方法.virtual的使用会有两种情况: 情况1:在基类中 ...
- jquery easyui datagrid 无滚动条,datagrid 没垂直滚动条
jquery easyui datagrid 无滚动条,datagrid 没垂直滚动条 ============================== 蕃薯耀 2018年2月6日 http://www. ...
- hibernate sqlite jdbctemplate 待研究
http://my.oschina.net/lldy/blog/39058 hibernate sqlite http://foru ...
- 用c语言如何在数字前自动补0
一: #include <stdio.h>int main(){ long a=3,b=4,c=15; printf("......."a,b,c);return 0; ...
- warning C4305:“初始化”:从“double”到“float”截断
编译VS项目时出现警告: warning C4305:“初始化”:从“double”到“float”截断(warning C4305: 'initializing' : truncation from ...
- 新唐ISP操作步骤(转)
1,电脑上装上“NuMicro_ICP_Programming_Tool_v1.18.5320.zip”:2,把目标板通过SWD口的NU-LINK连接到电脑的USB口上:3,打开桌面的“NuMicro ...
- 使用jquery的 $.grep实现es6的filter效果
现在es6是趋势,习惯了es6会方便的多,但是有时候由于项目的限制,会限制es6的使用,在处理数组的时候,往往会想将一个数组进行过滤产生另一个新数组,如es6的filter 如下,我又一个数组,[1, ...