码迷,mamicode.com
首页 > Web开发 > 详细

js彈出層或者js彈出引用url Frame 層

时间:2014-06-20 19:28:34      阅读:245      评论:0      收藏:0      [点我收藏+]

标签:style   class   blog   code   ext   color   

function Popup() {
    var _this = this;
    this.CssName = "layermask";//樣式
    //遮蓋層
    this.hiddLayer = function() {
        try{
            var obj = document.getElementById("syspopup_layer");
            if (obj != null)
                document.body.removeChild(obj);
        }catch(e){}
    };
    
    this.showLayer = function() {
        try{
            var obj = document.getElementById("syspopup_layer");
            if (obj == null) {
                obj = document.createElement("DIV");
                obj.id = "syspopup_layer";
                obj.className = this.CssName;
                obj.disabled = true;
                document.body.appendChild(obj);
                
                var size = qp_shared.getPageSize();

                obj.style.cssText = qp_shared.contact("left: 0px; width: ", size.width, "px; top: 0px; height: ", size.height, "px;");
            }
        }catch(e){}
    };
    
    this.showLoading = function() {
            if (el("sysimg_wait") == null) {
            this.Loading = document.createElement("IMG");
            this.Loading.id = "sysdiv_wait";
            this.Loading.src = qp_shared.getURL("images/wait/reloading.gif");
            this.Loading.style.zIndex = 999999;
            this.Loading.style.position = "absolute";                
            this.Loading.style.left = parseInt((window.document.documentElement.clientWidth - 24)/2) + "px";
            this.Loading.style.top = (parseInt((window.document.documentElement.clientHeight - 24)/2) + qp_shared.getDocumentScrollTop()) + "px";
            
            document.body.appendChild(this.Loading);
        };
    
        this.showLayer();
    };
    
    this.Render = function(url, w, h) {
        if (el("sysimg_wait") == null) {
            this.Loading = document.createElement("IMG");
            this.Loading.id = "sysdiv_wait";
            this.Loading.src = qp_shared.getURL("images/wait/reloading.gif");
            this.Loading.style.zIndex = 999999;
            this.Loading.style.position = "absolute";                
            this.Loading.style.left = parseInt((window.document.documentElement.clientWidth - 24)/2) + "px";
            this.Loading.style.top = (parseInt((window.document.documentElement.clientHeight - 24)/2) + qp_shared.getDocumentScrollTop()) + "px";
            
            document.body.appendChild(this.Loading);
        };
    
        if (el("sysdiv_loginFrame") == null) {
            this.DivFrame = document.createElement("DIV");
            this.DivFrame.id = "sysdiv_loginFrame";
            this.DivFrame.style.cssText = "z-index: 99999; position: absolute; left: 0px; top: 0px; display: none; width: 880px; height: 300px; background-color: #ffffff; border: solid 7px #ddd;";
        
            this.PageFrame = document.createElement("IFRAME");
            this.PageFrame.id = "sysifm_loginFrame";
            this.PageFrame.align = "middle";
            this.PageFrame.frameBorder = "0";
            this.PageFrame.scrolling = "auto";
            this.PageFrame.style.cssText = "z-index: 101; position: absolute; left: 0px; top: 0px";
            this.PageFrame.src = url;
            
            this.DivFrame.appendChild(this.PageFrame);
            document.body.appendChild(this.DivFrame);
        }
        else {
            this.PageFrame.src = url;
        }

        if (qp_shared.IsIE && this.PageFrame.readyState != "complete")
            this.PageFrame.onreadystatechange = function(e) { e = window.event || e; _this.onreadystatechange(e); };
        else if(!qp_shared.IsIE)
            this.PageFrame.onload = function(e) { e = window.event || e; _this.onreadystatechange(e); };
        else
            this.removeLoading();
    };
    
    this.RenderDiv=function(w,h,html){
        
        if (el("sysimg_wait") == null) {
            this.Loading = document.createElement("IMG");
            this.Loading.id = "sysdiv_wait";
            this.Loading.src = qp_shared.getURL("images/wait/reloading.gif");
            this.Loading.style.zIndex = 999999;
            this.Loading.style.position = "absolute";                
            this.Loading.style.left = parseInt((window.document.documentElement.clientWidth - 24)/2) + "px";
            this.Loading.style.top = (parseInt((window.document.documentElement.clientHeight - 24)/2) + qp_shared.getDocumentScrollTop()) + "px";
            
            document.body.appendChild(this.Loading);
        };
         
        if (el("sysDiv_Dialog") == null) {

                this.Div_Dialog = document.createElement("DIV"); //創建div對象
                this.Div_Dialog.id = "sysDiv_Dialog";
                this.Div_Dialog.style.cssText = "z-index: 99999; position: absolute; left: 0px; top: 0px; display: none; width:"+w+"px; height: "+h+"px; background-color: #ffffff; border: solid 7px #ddd;";
           }
            
        document.body.appendChild(this.Div_Dialog); //加入Div對話框
        document.body.removeChild(this.Loading);//移除加載圖片
            
        //html為填充div的內容
        if(html!=null){
           this.Div_Dialog.innerHTML =html;
        }
    };
    
    
    //加載完成事件
    this.onreadystatechange = function(e) {
        if ((qp_shared.IsIE && this.PageFrame.readyState == "complete") || (!qp_shared.IsIE)) {
            //清空事件
            if (this.PageFrame.onreadystatechange != null)
                this.PageFrame.onreadystatechange = null;
            //清空事件
            if (this.PageFrame.onload != null)
                this.PageFrame.onload = null;

            this.removeLoading();
        }
    };
    
    //創建一個占位控件
    this.renderPlace = function(container) {
        var objContainer = el(container);
        if (objContainer != null) {
            var obj = document.createElement("DIV");
            obj.className = "placeEmpty";
            
            objContainer.appendChild(obj);
        }
    };

    //設置窗口大小
    this.setWindowSize = function(width, height) {
        this.PageFrame.width = this.DivFrame.style.width = width + "px";
        this.PageFrame.height = this.DivFrame.style.height = height + "px";

        this.DivFrame.style.left = (window.document.documentElement.clientWidth - width) / 2 + "px";
        this.DivFrame.style.top = ((window.document.documentElement.clientHeight- height) / 2 + qp_shared.getDocumentScrollTop()) + "px";

        this.DivFrame.style.display = "";
    };
    

    //設置Div窗口大小
    this.setDivWindowSize = function(width, height) {
        this.Div_Dialog.width =width + "px";
        this.Div_Dialog.height = height + "px";

        this.Div_Dialog.style.left = (window.document.documentElement.clientWidth - width) / 2 + "px";
        this.Div_Dialog.style.top = ((window.document.documentElement.clientHeight- height) / 2 + qp_shared.getDocumentScrollTop()) + "px";

        this.Div_Dialog.style.display = "";
    };

    //隱藏彈出窗口及遮蓋層
    this.hidden = function() {
        try {
            if (this.DivFrame != null) {
                document.body.removeChild(this.DivFrame);
            }
        }catch(e){};

        this.hiddLayer();
        this.removeLoading();
    };
    
    //只關掉彈出窗口,仍然顯示遮蓋層
    this.close = function() {
        try {
            if (this.DivFrame != null) {
                document.body.removeChild(this.DivFrame);
            }
        }catch(e){};
    };

    //關掉DIV彈出窗口
    this.closeDiv = function () {
        try {
            if (this.Div_Dialog != null) {
                document.body.removeChild(this.Div_Dialog);
                this.hiddLayer();
            }
        } catch (e) {};
    };
    
    //隱藏Loading
    this.removeLoading = function() {
        try {
            if (this.Loading != null) {
                //當前窗口
                var obj = document.getElementById("sysdiv_wait");
                if (obj != null) {
                    document.body.removeChild(obj);
                }

                //父窗口
                if (window.parent != null) {
                    obj = window.parent.document.getElementById("sysdiv_wait");
                    if (obj != null) {
                        window.parent.document.body.removeChild(obj);
                    }
                }
            }
        }catch(e){};    
    };

    //顯示彈出窗口
    this.show = function(url, width, height, showPlace, cssName) {
        //顯示一個占位控件
        if (showPlace != null && showPlace != "") {
            this.renderPlace(showPlace);
        };
        
        //如果有自定css
        if (cssName != null) {
            this.CssName = cssName;
        };        
        
        //為了你防止緩存加了一個隨機數
        this.Render(qp_shared.getRandomUrl(url), width, height);
        
        this.showLayer();

        this.setWindowSize(width, height);
    };
    
    //彈出DIV
    this.showDivDialog = function (width, height, html) {

        this.showLayer();
        this.RenderDiv(width, height, html);
        this.setDivWindowSize(width, height);
    }
    
};

var oPopup = new Popup();

 

js彈出層或者js彈出引用url Frame 層,布布扣,bubuko.com

js彈出層或者js彈出引用url Frame 層

标签:style   class   blog   code   ext   color   

原文地址:http://www.cnblogs.com/yzenet/p/3796234.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!