大家帮我看看这个弹出窗口的效果为啥不能二次点击

但是如果去掉那个filter属性的话，每次点击完了内存会自动还原，我看到有些这类效果也有filter可是却不像我那样内存不还原，不知道那个怎么搞的

解决方案 »

  1.   

    逻辑有问题
    一、你可以每天点击的时候动态创建两个ＤＩＶ
    二、也可以事前把ＤＩＶ放到页面点击的时候通过ＩＤ获取
    你选择的第二种，可是你为什么每次都对背景
     document.body.appendChild(bgObj);var bgObj=document.getElementById("bgDiv");
    前景确定是msgObj.style.display="";而且关闭的时候
    document.body.removeChild(bgObj);
    document.body.removeChild(msgObj);
    两个都删除了一下半闭后再点击的时候 var msgObj=document.getElementById("msgDiv")这句肯定会报错，因为这个ＤＩＶ被移除了好好旅順一下逻辑吧
      

  2.   

    你都给remove掉了，肯定不会再显示了
    <script   type="text/javascript"   language="javascript">
    //more   javascript   from   http://www.smallrain.net
    function   sAlert(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>
    <input   type="button"   value="点击这里"   onClick="sAlert( 'test弹窗效果 ');"   />
      

  3.   

    试试CollectGarbage()或者试试不去remove
    而是给利用document.body.innerHTML="<input   type=\"button\"   value=\"点击这里\"   onClick=\"sAlert( 'test弹窗效果 ');\"   />"
      

  4.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    </head>
    <body><style type="text/css">
    *{
        margin:0px;padding:0px;
    }
    #msgDiv {
        z-index:10001;
    width:500px;
    height:400px;
    background:white;
    border:#336699 1px solid;
    position:absolute;
    left:50%;
    top:20%;
    font-size:12px;
    margin-left:-225px;
    display: none;
    }
    #bgDiv {
        display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 9000;
    background-color: #777;
    filter:alpha(opacity=25);
    -moz-opacity: 0.6;
    opacity: 0.6;
    }
    </style>
    <input type="button" value="点击这里" onclick="sAlert();" /><div id="msgDiv">内容<br><span id="msgShut">关闭</span></div>
    <div id="bgDiv"></div>
    <script type="text/javascript" language="javascript">
    //背景
    var bgObj=document.getElementById("bgDiv");
    bgObj.style.width = document.body.offsetWidth + "px";
    bgObj.style.height = screen.height + "px";//定义窗口
    var msgObj=document.getElementById("msgDiv")
    msgObj.style.marginTop = -75 + document.documentElement.scrollTop + "px";//关闭
    document.getElementById("msgShut").onclick = function(){
    bgObj.style.display = msgObj.style.display = "none";
    }function sAlert(){
    msgObj.style.display = bgObj.style.display = "block";
    }
    </script></body>
    </html>
      

  5.   

    因为用.appendChild 
    所以每点一次内存就增加