本文介绍如何通过原生JavaScript和jQuery两种方式实现点击超链接弹出提示层，并在点击页面空白区域时自动隐藏该层的功能。重点解析事件绑定、DOM元素显示与隐藏的控制逻辑，以及阻止事件冒泡的处理技巧，提供完整可运行的代码示例。
原生JS实现点击链接显示与隐藏层
请教一下.点击 超连接,提示一个层.点击空白.层消失. 原生js版
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML>
<HEAD>
<TITLE>提示</TITLE>
<META http-equiv=content-type content="text/html; charset=gbk">
<STYLE type=text/css>
BODY {
BACKGROUND: #fff; FONT: 76%/1.5 Arial,sans-serif; COLOR: #333
}
input{
width:200px;border: 1px solid #86B9D6;
}
#reg_div{
color: #154BA0;
border: 1px solid #86B9D6;
background: #D9EEF9;
position: absolute;
z-index: 30;
height: 180px;
width:400px;
}
.city{
width:80px;
float:left;
padding:8px;
text-align:center;
}
.ps_div{
padding:10px 10px 2px 10px;
border-bottom:1px dotted #ccc;
}
</STYLE>
</HEAD>
<body>
<input id=input_01 type="text" onfocus="allt(this);">
<div id=reg_div style="display:none">
<div class=ps_div><span style="float:right;" onclick="oo('reg_div').style.display='none'">关闭</span>查找提示:</div>
<div id=city_01 class=city onclick="bllt(this)">北京</div>
<div id=city_02 class=city onclick="bllt(this)">上海</div>
<div id=city_03 class=city onclick="bllt(this)">广州</div>
<div id=city_04 class=city onclick="bllt(this)">深圳</div>
<div id=city_01 class=city onclick="bllt(this)">杭州</div>
<div id=city_02 class=city onclick="bllt(this)">南京</div>
<div id=city_03 class=city onclick="bllt(this)">成都</div>
<div id=city_04 class=city onclick="bllt(this)">武汉</div>
<div id=city_01 class=city onclick="bllt(this)">青岛</div>
<div id=city_02 class=city onclick="bllt(this)">大连</div>
<div id=city_03 class=city onclick="bllt(this)">重庆</div>
<div id=city_04 class=city onclick="bllt(this)">三亚</div>
<div id=city_01 class=city onclick="bllt(this)">郑州</div>
<div id=city_02 class=city onclick="bllt(this)">宁波</div>
<div id=city_03 class=city onclick="bllt(this)">西安</div>
<div id=city_04 class=city onclick="bllt(this)">长沙</div>
</div>
</body>
</HTML>
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
jQuery版本实现方案
jquery版本：
function object_Onclick(){
$('#eng_list').css('display','none');//将显示的层隐藏消失
}
window.document.onclick = object_Onclick;