<%...@ page language="java" pageEncoding="GBK"%><%...@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean"%><%...@ taglib uri="http://struts.apache.org/tags-html" prefix="html"%><%...@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic"%><%...@ taglib uri="http://struts.apache.org/tags-tiles" prefix="tiles"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html:html lang="true"><head> <html:base /> <title>index.jsp</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <script language="javascript">... function Open() ...{ //隐藏select控件 DispalySelect(0); //显示遮罩层 document.getElementById("divPageMask").style.display="block"; //处理遮罩层 resizeMask(); window.onResize = resizeMask; //显示弹出窗口 document.getElementById("divOpenWin").style.display="block"; } function Close() ...{ //显示select控件 DispalySelect(1); //处理遮罩层 divPageMask.style.width = "0px"; divPageMask.style.height = "0px"; divOpenWin.style.display = "none"; window.onResize = null; document.getElementById("divOpenWin").style.display="none"; } //页面遮罩 function resizeMask() ...{ divPageMask.style.width = document.body.scrollWidth; divPageMask.style.height = document.body.scrollHeight; divOpenWin.style.left = ((document.body.offsetWidth - divOpenWin.offsetWidth) / 2); divOpenWin.style.top = ((document.body.offsetHeight - divOpenWin.offsetHeight) / 2); } function DispalySelect(val) ...{ //显示和隐藏select控件 var dispalyType; var arrdispalyType=["hidden","visible"]; var arrObjSelect=document.getElementsByTagName("select"); for (i=0;i<arrObjSelect.length;i++) ...{ arrObjSelect[i].style.visibility=arrdispalyType[val]; } } function submit()...{ var spanName = document.getElementById("spanName"); var nameText = document.getElementById("nameText"); var text = document.form1.text; if(nameText.value!="")...{ spanName.innerHTML=nameText.value; text.value=nameText.value; alert(nameText.value); Close(); }else...{ spanName.innerHTML="*"; Close(); } } </script> <style type="text/css">... .body,td{...}{font-size:12px;} .body{...}{filter:alpha(opacity=50);} #divBase{...}{z-index:0;height: 100%} #divPageMask{...}{z-index:1; background-color:#cccccc; position: absolute; left:0px; top:0px; filter:alpha(opacity=50); height: 100%} #divOpenWin{...}{z-index:50; background-color:#EEEEEE; position: absolute; left:0px; top:0px; display: none; width:300px;height:150px} </style></head><body> <div id="divBase"> <p align="center"> <a href="javascript:Open();" onclick="">打开遮罩</a> <br /> <input type="button" value="button" onClick="alert('123123')"> </p> <table height="450" width="95%" border="1" align="center"> <tr> <td align="center"> 效果 </td> </tr> <tr> <td align="center"> <form action="?" method="post" name="form1"> <input type="text" value="" name="text"> </form> </td> </tr> <tr> <td align="center"> <span id="spanName">*</span> </td> </tr> </table> </div> <div id="divPageMask"></div> <div id="divOpenWin"> <table border="0" width="100%"> <tr> <td align="center" colspan="2"> <a href="javascript:Close();">关闭</a> </td> </tr> <tr> <td width="30%" align="center"> 姓名 </td> <td> <input type="text" id="nameText"> </td> </tr> <tr> <td> </td> <td> <input type="submit" value="提交" onClick="submit()"> </td> </tr> </table> </div></body></html:html>