方法一.

<!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啊 找了很久，都没有很好解决的更多相关文章

  1. Jquery点击除了指定div元素其他地方，隐藏该div

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script ty ...

  2. js构建函数，点击按钮显示div，再点击按钮或其他区域，隐藏div

    这只是一个例子,先看看效果: html代码: <nav> <span class="nav_logo"></span> <h1>云蚂 ...

  3. js实现的点击div区域外隐藏div区域

    首先看下JS的事件模型,JS事件模型为向上冒泡,如onclick事件在某一DOM元素被触发后,事件将跟随节点向上传播,直到有click事件绑定在某一父节点上,如果没有将直至文档的根. 阻止冒泡:1.对 ...

  4. 点击区域外隐藏该区域，event.stopPropagation()

    event.stopPropagation() Description: Prevents the event from bubbling up the DOM tree, preventing an ...

  5. 点击页面其它地方隐藏该div的两种思路

    思路一 第一种思路分两步 第一步:对document的click事件绑定事件处理程序,使其隐藏该div 第二步:对div的click事件绑定事件处理程序,阻止事件冒泡,防止其冒泡到document,而 ...

  6. 点击页面其它地方隐藏该div的方法

    思路一 第一种思路分两步 第一步:对document的click事件绑定事件处理程序,使其隐藏该div 第二步:对div的click事件绑定事件处理程序,阻止事件冒泡,防止其冒泡到document,而 ...

  7. js实现点击按钮时显示弹框，点击按钮及弹框以外的区域时隐藏弹框

    转自https://blog.csdn.net/yimawujiang/article/details/86496936 问题:js实现点击按钮时显示弹框,点击按钮及弹框以外的区域时隐藏弹框? 方案一 ...

  8. jquery点击元素之外触发事件

    $("#errorMsg_layer").bind("click",function(e){ if($(e.target).closest("#err ...

  9. 设立点击ProgressDialog外的区域对话框不消失

    设置点击ProgressDialog外的区域对话框不消失ProgressDialog mpDialog = new ProgressDialog(OrderTable.this);  mpDialog ...

随机推荐

  1. association 的使用

    <resultMap id="wmsTaskMap" type="WmsTask"> <id column="ID" jd ...

  2. web -- 前端访问后台跨区问题解决

    package com.xindatai.ibs.web.filter; import java.io.IOException; import javax.servlet.Filter; import ...

  3. [转]mac osx 下的apt-get，yum的代替工具 －－－－homebrew

    原文地址:http://blog.csdn.net/tsxw24/article/details/15500517 linux下有很方便的包管理器如:apt-get.yum,mac下也有类似的工具:H ...

  4. PHP 5.4 中的traits

    PHP 5.4中的traits,是新引入的特性,中文还真不知道如何准确翻译好.其实际的目的,是为了有的场合想用多继承,但PHP又没多继承,于是就发明了这样的一个东西. Traits (横向重用/多重继 ...

  5. TTL值

    我们在解析域名时经常出现 TTL 这个字段,里面默认写的是 10 分钟. 另外,有时候我们 ping 某域名或 IP 的时候,会出现 TTL= XXX. 一.什么是域名的 TTL 值? TTL(Tim ...

  6. iOS开发--改变tableHeaderView的高度

    1.先获取tableHeaderView 2.设置它的frame 3.将该view设置回tableview UIView *view=tableView. tableHeaderView; view. ...

  7. Ubuntu图形界面和字符界面转换、指定默认启动界面

    1.按ALT+CTRL+F1.F2.F3.F4.F5.F6.F7可来回切换7个界面(Linux实体机)      其中ALT+CTRL+F7可切换到图形界面(Linux实体机)        如果是V ...

  8. 微信小程序的wx-charts插件

    还有就是可以使用一些小程序的插件,比如wx-charts. 先来看一下网上对这个插件的评价: 目前在github上有1804颗星,使用的比较广泛. github地址:https://github.co ...

  9. 《计算机图形学》2.1.4 彩色CRT监视器

    CRT监视器利用能发射不同颜色光的荧光层的组合来显示彩色图形.不同荧光层的发射光组合起来,可以生成一种按其比例而定的可见颜色. 显示彩色图形的一种方法是在屏幕上涂上多层不同的荧光粉.发射颜色由电子束在 ...

  10. mysql学习笔记(三)

    -- 主键冲突(duplicate key) ,'xujian','anhui'); ,'xiewei','anhui'); ,'luyang','anhui');-- 主键冲突了 -- 可以选择性的 ...