页面弹出一个层，只能在这个层上做操作，要想操作其他的必须关闭这个层！！

页面弹出一个层，只能在这个层上做操作，要想操作其他的必须关闭这个层！！这个功能怎么实现，弹出层我会弄，怎么让他不能编辑其他地方呢？

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

<style type="text/css" media="all" title="Default">
body { background-color:appworkspace; margin:0; padding:0; }
.button { font-size:9pt; font-family:verdana; border-left:4px solid #444; border-top:1px solid #444; border-bottom:1px solid #444; border-right:1px solid #444; margin:20px; }
</style>
<script type="text/javascript"> function neverDialog(event, msg, handler, notfilter) { window._timer = null;
var ie = document.all?true:false;
if (event) event.srcElement ? event.srcElement.blur() : event.target.blur();
if (_timer) window.clearTimeout(_timer);
function getElById(idStr) { return document.getElementById(idStr); }
var d = getElById("dialog");
var a = getElById("demo");
var Htmls = "";
var cnt = 20;
Htmls += "<html xmlns=\"http://www.w3.org/1999/xhtml\">\n"
+ "<head>\n"
+ "<style text=\"text/css\">\n"
+ "body { margin:40px; background-color:#eeeeee; }\n"
+ "* { font-size:9pt; font-family:verdana; }\n"
+ ".bold { font-weight:bold; }\n"
+ ".button { width:100px; border-left:4px solid #444; border-top:1px solid #444; border-bottom:1px solid #444; border-right:1px solid #444; }\n"
+ "</style>\n"
+ "</head>\n"
+ "<body>\n"
+ "<p align='center'>never dialog demo, just a test, http://blog.never-online.net</p>\n"
+ "<p align='center' class='bold'>" +msg+ "</p>\n"
+ "<p align='center'>\n"
+ "<input class='button' type='button' value=' - O K - ' onclick='top.window.document.getElementById(\"demo\").style.display=\"none\";" +(handler?";top.window."+handler+"":"")+ "\'/>\n"
+ "<input type='button' class='button' value=' - N O -' onclick='top.window.document.getElementById(\"demo\").style.display=\"none\";top.window.document.body.style.overflow=\"\"'/>"
+ "</p>\n"
+ "</body>\n"
+ "</html>"
d.contentWindow.document.open("text/html");
d.contentWindow.document.write(Htmls);
d.contentWindow.document.close();
with(a.style) {
display = "block";
left="0px";
top="0px";
  margin="0px";
width=(document.body.clientWidth||window.innerWidth)+"px";
height=(document.body.scrollHeight+25)+"px";
}
function f_alpha() {
if (++cnt>=80) {
window.clearTimeout(_timer);
return;
}
ie?a.style.filter="alpha(opacity=" +cnt+")":a.style.MozOpacity=(cnt/100)+"";
_timer = window.setTimeout(f_alpha, 10);
}; notfilter?'':f_alpha();
}
function handler(event) {
neverDialog(event,'welcome to http://blog.never-online.net');
}
//]]>
</script>
</head>
<body id="www.never-online.net">
<input type="button" value="Excute it" onclick="neverDialog(event,'Are You Sure To Excute it?','handler(event)')" class="button"/>
<div height="100%" width="100%" style="display:none;position:absolute;-moz-opacity:0.6" id="demo">
<iframe id="dialog" height="100%" width="100%" frameborder="0" marginheight="0" marginwidth="0" style="font-size:9pt; font-family:verdana;">
</iframe>
</div>
<input><br>
<input><br>
<input><br>
<input><br>
<input><br>
<input><br>
<input><br>
<input><br><input><br>
<input><br><input><br><input><br><input><br><input><br><input><br>
</body>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>对话框</title>
    <script type="text/javascript" language="javascript">

        function InformationMessageBox(str){
            var msgw,msgh,bordercolor;
            msgw=400;               //提示窗口的宽度
            msgh=100;               //提示窗口的高度
            titleheight=25          //提示窗口标题高度
            bordercolor="#c51100";  //提示窗口的边框颜色
            titlecolor="#c51100";   //提示窗口的标题颜色            var sWidth,sHeight;
            sWidth=screen.width;
            sHeight=screen.height;            var bgObj=document.createElement("div");
            bgObj.setAttribute('id','bgDiv');
            bgObj.style.position="absolute";
            bgObj.style.top="0";
            bgObj.style.background="#cccccc"; //灰色，覆盖原始页面
            bgObj.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";
            bgObj.style.opacity="0.6";
            bgObj.style.left="0";
            bgObj.style.width=sWidth + "px";
            bgObj.style.height=sHeight + "px";
            bgObj.style.zIndex = "10000";
            document.body.appendChild(bgObj);            var msgObj=document.createElement("div")
            msgObj.setAttribute("id","msgDiv");
            msgObj.setAttribute("align","center");
            msgObj.style.background="white";
            msgObj.style.border="1px solid " + bordercolor;
            msgObj.style.position = "absolute";
            msgObj.style.left = "50%";
            msgObj.style.top = "50%";
            msgObj.style.font="12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif";
            msgObj.style.marginLeft = "-225px" ;
            msgObj.style.marginTop = -75+document.documentElement.scrollTop+"px";
            msgObj.style.width = msgw + "px";
            msgObj.style.height =msgh + "px";
            msgObj.style.textAlign = "center";
            msgObj.style.lineHeight ="25px";
            msgObj.style.zIndex = "10001";            var title=document.createElement("h4");
            title.setAttribute("id","msgTitle");
            title.setAttribute("align","right");
            title.style.margin="0";
            title.style.padding="3px";
            title.style.background=bordercolor;
            title.style.filter="progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);";
            title.style.opacity="0.75";
            title.style.border="1px solid " + bordercolor;
            title.style.height="18px";
            title.style.font="12px Verdana, Geneva, Arial, Helvetica, sans-serif";
            title.style.color="white";
            title.style.cursor="pointer";
            title.innerHTML="关闭";
            title.onclick=function(){
            document.body.removeChild(bgObj);
            document.getElementById("msgDiv").removeChild(title);
            document.body.removeChild(msgObj);
            }
            document.body.appendChild(msgObj);
            document.getElementById("msgDiv").appendChild(title);
            var txt=document.createElement("p");
            txt.style.margin="1em 0"
            txt.setAttribute("id","msgTxt");
            txt.innerHTML=str;
            document.getElementById("msgDiv").appendChild(txt);
            }
    </script></head>
<body>
    <form id="form1" runat="server">
    <div>
        <input type="button" value="点击这里" onclick="InformationMessageBox('test弹窗效果');" />
    </div>
    </form>
</body>
</html>