JavaScript+DIV模态对话框的完美实现（克服select问题）

对于JavaScript+DIV模态对话框的方法很多，但是普遍都存在一个缺点，就是select不可见。一下是我从一个国外论坛上看到的实现，其完美的解决了我们之前所看到的select不可见问题。

 

 

 var maskpanel=function()
    {
        this.divobj;
        this.show=function()
        {
          if(!document.getElementById("xdivmasking"))
          {
              var divEle=document.createElement('div');
              divEle.setAttribute("id","xdivmasking");
              document.body.appendChild(divEle);
              var divSty=document.getElementById("xdivmasking").style;
              divSty.position="absolute";divSty.top="0px";divSty.left="0px";divSty.zIndex="46";divSty.opacity=".50";divSty.backgroundColor="#000";
              divSty.filter="alpha(opacity=50)";

              var divFram=document.createElement('iframe');
              divFram.setAttribute("id","xmaskframe");
              document.body.appendChild(divFram);
              divSty=document.getElementById("xmaskframe").style;
              divSty.position="absolute";divSty.top="0px";divSty.left="0px";divSty.zIndex="45";divSty.border="none";divSty.filter="alpha(opacity=0)";
           }

           this.divobj=document.getElementById("xdivmasking");
           this.waitifrm=document.getElementById("xmaskframe");
          
           var dsh=document.documentElement.scrollHeight;
           var dch=document.documentElement.clientHeight;
           var dsw=document.documentElement.scrollWidth;
           var dcw=document.documentElement.clientWidth;
          
           var bdh=(dsh>dch)?dsh:dch;
           var bdw=(dsw>dcw)?dsw:dcw;

           this.waitifrm.style.height=this.divobj.style.height=bdh+'px';
           this.waitifrm.style.width=this.divobj.style.width=bdw+'px'; 
           this.waitifrm.style.display=this.divobj.style.display="block";
        };
        this.hide=function()
        {
            this.waitifrm.style.display=this.divobj.style.display="none";
        };
    }

 

 

将以上代码包含于body体的script块中。

显示实现：

divmask=new maskpanel();   

divmask.show();  

 

 

关闭实现：

 

divmask.hide();