当点击DIV以外的地方,隐藏该DIV
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>点击文字弹出层</title>
<style type="text/css">
<!--
*{font-size:12px;font-family:Verdana, Geneva, sans-serif;line-height:14px}
a{color:#039}
a:hover{color:#f60}
.pop{position:absolute;left:40%;top:40%;width:300px;height:100px;background:#eee;border:1px solid #ccc}
.pop_head{position:relative;height:20px;background:#ccc}
.pop_head a{position:absolute;right:8px;line-height:20px;color:#000;text-decoration:none}
.pop_head a:hover{color:#f60;text-decoration:none}
.pop_body{padding:8px}
-->
</style>
</head>
<body>
<!--首先设置一个层:-->
<div id="pop" class="pop" style="display:none">
<div class="pop_head">
<a href="javascript:void(0);" onclick="hide()">关闭</a>
</div>
<div class="pop_body">
谢谢光临……
</div>
</div>
<!--弹出层的按钮:-->
<a href="javascript:void(0);" onclick="show();">弹出按钮</a>
<script type="text/javascript">
var EX = {
addEvent : function(k, v) {
var me = this;
if (me.addEventListener)
me.addEventListener(k, v, false);
else if (me.attachEvent)
me.attachEvent("on" + k, v);
else
me["on" + k] = v;
},
removeEvent : function(k, v) {
var me = this;
if (me.removeEventListener)
me.removeEventListener(k, v, false);
else if (me.detachEvent)
me.detachEvent("on" + k, v);
else
me["on" + k] = null;
},
stop : function(evt) {
evt = evt || window.event;
evt.stopPropagation ? evt.stopPropagation() : evt.cancelBubble = true;
}
};
document.getElementById('pop').onclick = EX.stop;
var url = '#';
function show() {
var o = document.getElementById('pop');
o.style.display = "";
setTimeout(function() {
EX.addEvent.call(document, 'click', hide);
});
}
function hide() {
var o = document.getElementById('pop');
o.style.display = "none";
EX.removeEvent.call(document, 'click', hide);
}
</script>
</body>
</html>
相关推荐
鼠标点击div外的地方让div窗口隐藏消失，实现方法有很多，在本文将为大家介绍下jquery中时如何实现的，感兴趣的朋友不要错过了哈
接着看下vue实现点击目标元素外页面的其他地方隐藏弹窗 方法： 步骤1：给页面最外出的元素div加点击事件：@click=“popShow = false”。 步骤2：给点击目标元素加点击事件：@click=“popShow = true”。 备注：...
在本文为大家介绍两种思路实现点击页面其它地方隐藏该div，第一种是对document的click事件绑定事件处理程序..详情请参考本
代码如下，实现了点击input显示一个div层，当点击除input和div以外的地方的时候，隐藏div的功能。 <!DOCTYPE html> <html> <head> <meta charset=utf-8 /> <title>点击其它地方关闭DIV&...
方法一： 在外层div添加事件 @click=”closeSel...currentCli.contains(event.target)){ //点击到了id为sellineName以外的区域，隐藏下拉框 this.listLineUl = false; } } } 方法二、element.addEventListener(eve
回想一下菜单的特征：每次显示一级菜单，如果该级菜单中某菜单项中有子菜单，当鼠标经过或者点击该菜单项时弹出下级子菜单，这是一个递归的过程。如果我们可以：每次显示一级xml的内容，如果该级xml中某节点有子节点...
当浏览者再一次浏览该页面的时候，生成的.DLL就会在服务器上运行，并响应用户在该页面上的请求或响应，ASP.NET应用程序的解释过程图如4-6所示。 图4-6 代码隐藏页模型页面的执行过程 在客户端浏览器访问该页面时，...
2.hidden 隐藏的，溢出的内容全部隐藏，不可见溢出 3.scroll 显示滚动条，溢出时可用 4.auto 自动，溢出时自动显示滚动条并且可用 ============================== 9.29 1、边框线 属性：border： 取值： 2、...
隐藏边注 本文右边有一些注释，主要是用来提供一些相关信息，或者给没有程序员背景的读者解释一些基本概念，通常可以忽略。 正则表达式到底是什么东西？ 字符是计算机软件处理文字时最基本的单位，可能是字母，数字...
尽我所知，除了文中特别加以标注和致谢的地方外，论文中不包含其他人已经发表或撰写过的研究成果，也不包含为获得东南大学或其它教育机构的学位或证书而使用过的材料。与我一同工作的同志对本研究所做的任何贡献均已...
public 说明类为公共类，该类可以被当前包以外的类和对象使用。 private 说明类为私有类。 （4） extends 子句用于说明类的直接超类。 （5） implements 子句用于说明类中将实现哪些接口，接口是 Java 的一种...
这是一个典型的分支控制指令,该指令的作用完全类似于Java语言中的if,if指令的语法格式如下: <#if condition>... <#elseif condition>... <#elseif condition>... <#else> ... 例子如下: (age>60)>老年人 ...