日期:2014-05-16  浏览次数:20313 次

[JS]DialogClass--禁止页面点击类(转)

<HTML>
<HEAD>
<META http-equiv='Content-Type' content='text/html; charset=gb2312'>
<TITLE>
</TITLE>

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
/** 
 * 类 名 称: DialogClass 
 * 功能说明: 禁止页面点击类 
 * 版权信息: CopyRight 2005-2006 JoeCom 
 * 创 建 人: JoeCom | MSN:juwuyi@hotmail.com |  blog:http://hi.baidu.com/joecom 
 * 创建日期: 2006-07-21 
 * 修 改 人:  
 * 修改日期:  
 */ 

function DialogClass(){ 
    this.blankImgHandle = null; 
    this.tags = new Array("applet", "iframe", "select","object","embed"); 
    this.body_overflow_y = null; 
    this.body_overflow_x = null; 
    
    this.hideAllSelect = function() 
    { 
        
       for( var k=0;k<this.tags.length;k++) 
       { 
           var selects = document.getElementsByTagName(this.tags[k]);     
           for (var i=0;i<selects.length;i++) 
           { 
               selects[i].setAttribute("oldStyleDisplay",selects[i].style.visibility); 
               selects[i].style.visibility = "hidden"; 
           } 
       }        
    } 
     
    this.resetAllSelect = function() 
    {        
       for( var k=0;k<this.tags.length;k++) 
       { 
           var selects = document.getElementsByTagName(this.tags[k]);     
           for (var i=0;i<selects.length;i++) 
           {            
               if (selects[i].getAttribute("oldStyleDisplay")!=null) 
                  selects[i].style.visibility = selects[i].getAttribute("oldStyleDisplay"); 
           } 
        }     
    }         
         
   this.show = function() 
   {     
      this.body_overflow_y = document.body.style.overflowY; 
       this.body_overflow_x = document.body.style.overflowX; 
       document.body.style.overflowX = "hidden"; 
       document.body.style.overflowY = "hidden"; 
      this.hideAllSelect(); 
             
        var w = "100%" ; 
        var h = "100%" ; 
         
        this.blankImgHandle = document.createElement("DIV"); 
        with (this.blankImgHandle.style){ 
            position = "absolute"; 
            left     = 0; 
            top      = document.body.scrollTop; 
            height   = "100%"; 
            width    = "100%"; 
            zIndex   = "9999"; 
            filter   = "progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60)"; 
            opacity  = "0.6"; 
            backgroundColor = "#ffffff";              
        }          
         
        document.body.appendChild(this.blankImgHandle);         
   }         
         
   this.close = function(){                
         document.body.style.overflowY = this.body_overflow_y;                
      document.body.style.overflowX = this.body_overflow_x; 
      if (this.blankImgHandle) 
      { 
          this.blankImgHandle.parentNode.removeChild(this.blankImgHandle); 
      }       
      this.resetAllSelect();            
  } 
}

// End -->
</SCRIPT>

</HEAD>
<BODY >
<button onclick="demo()">DialogClass</button> 
<script> 
function demo() 
{ 
  var dialog = new DialogClass();   
  dialog.show(); //关闭:dialog.close();  
} 
</script>

</BODY></HTML>

?原理:在整个页面铺一个width=100% ,height=100% 的div,并使z-index为很大的数,从而达到静止页面点击的功能。

?

转至:http://hi.baidu.com/joecom/blog/item/acb8cf1b1ac9f8faae513352.html