css：
.showdiv
{
width: 100%
height: auto
position: absolute
left: 0
top: 0
z-index: 999
display: none
}
.count_div
{
width: 500px
height: 400px
margin-top: 120px
margin-left: auto
margin-right: auto
margin-bottom: 0
border: 1px solid #aaaaaa
background: #fff
}
.brg
{
width: 100%
background: #ededed
position: absolute
top: 0
left: 0
filter: alpha(opacity=60)
-moz-opacity: 0.6
opacity: 0.6
position: absolute
top: 0
left: 0
display: none
z-index: 998
}
js:
function close () {
$("#brg").css("display", "none")
$("#showdiv").css("display", "none")
}
function show() {
$("#brg").css("display", "none")
$("#div_show").css("display", "none")
}
$(document).bind('keydown', 'esc',function (evt){
//关闭层代码
close ()
return false})
html：
<!--遮罩层-->
<div class="brg" id="brg">
</div>
<!--显示层-->
<div class="showdiv" id="div_order">
<div class="count_div" id="div_order_count">
内容
</div>
</div>
在网上找一个“jquery.hotkeys.js”的js包，里面都是jquery整理好的热键，
引入jquery包。
$(document).bind('keydown', 'esc',function (evt){
//关闭层代码
return false})
手敲，未测试，应该不会有太大问题，根据自己内容修改
你不是写的差不多了<script type="text/javascript">function removeElement(id)
{
document.getElementById(id).style.display="none"
}
</script>上面是js部分，下面这段是html的，我尽量简化一些<div id="bar1"> <img>
<p onclick="removeElement('bar1')">关闭</p></div>
<div id="bar2">
<img>
<p onclick="removeElement('bar2')">关闭</p>
</div>
