Javascript弹出带关闭的DIV层

<script type="text/javascript" language="javascript">
function show(checkbox_list){
var checkbox_list = document.getElementById(checkbox_list);
checkbox_list.style.display = "block";
}
function hidden(checkbox_list){
var checkbox_list = document.getElementById(checkbox_list);
checkbox_list.style.display = "none";
}
</script>

<table width="100%" border="0" cellpadding="0" cellspacing="1" class="table">

<tr>
<td colspan="7" style="position:relative;">
<input name="b2" type="button" value="订餐" class="button" onclick="show('checkbox_sizemodellist')" />
<!--div begin-->
<div id="checkbox_sizemodellist" style="display:none;z-index:2000;position:absolute;left:3px;top:23px;border:1px solid #06c;padding:0px;background:#fff;">
<div style="background:#0184de;text-align:right;padding-right:3px;"><span style="width:12;border-width:0px;color:white;font-family:webdings; cursor:hand; left:-200;" onclick="hidden('checkbox_sizemodellist')">r</span></div>
<asp:PlaceHolder ID="phl" runat="server"></asp:PlaceHolder>
     <input name="" type="button" class="button" style="width:40px;" value="提交"/> <input name="" class="button" type="button" onclick="hidden('checkbox_sizemodellist')" value="关闭" style="width:40px;"/><br />
</div>
<!--div end-->
</td>
</tr>
</table>