动态层显示信息

 

动态层显示信息

<script type="text/javascript">
/**
 * @author zxub 2006-06-01
 * 状态信息显示类，用var Status=new function()定义，可以静态引用其中的方法
 * 一般情况下为function Status()，这样不能静态引用其中的方法，需要通过对象来引用
 */
var Status=new function()
{
    this.statusDiv=null;
   
    /**
     * 初始化状态显示层
     */
 this.init=function()
 {
     if (this.statusDiv!=null)
     {
         return;
     }
  var body = document.getElementsByTagName("body")[0];
  var div = document.createElement("div");
  div.style.position = "absolute";
  div.style.top = "50%";
  div.style.left = "50%";
  div.style.width = "280px";
  div.style.margin = "-50px 0 0 -100px";  
  div.style.padding = "15px";
  div.style.backgroundColor = "#353555";
  div.style.border = "1px solid #CFCFFF";
  div.style.color = "#CFCFFF";
  div.style.fontSize = "14px";
  div.style.textAlign = "center";
  div.id = "status";
  body.appendChild(div);
  div.style.display="none";
  this.statusDiv=document.getElementById("status");
 }
 
 /**
  * 设置状态信息
  * @param _message:要显示的信息
  */ 
 this.showInfo=function(_message)
 {  
     if (this.statusDiv==null)
     {
         this.init();
     } 
     this.setStatusShow(true);
     this.statusDiv.innerHTML = _message;    
 }
 
 /**
  * 设置状态层是否显示
  * @param _show:boolean值，true为显示，false为不显示
  */
 this.setStatusShow=function(_show)
 {  
     if (this.statusDiv==null)
     {
         this.init();
     }
     if (_show)
     {
         this.statusDiv.style.display="";
     }
     else
     {
         this.statusDiv.innerHTML="";
         this.statusDiv.style.display="none";
     }
 }
}
</script>
<input type="button" onclick="Status.showInfo('hellwo world')" value="test">
<input type="button" onclick="Status.setStatusShow(false)" value="test">