layer open弹出空白页面解决方法

情况说明:当同事用笔记本访问服务器时在列表打开一个窗口时,经常出现空白页面,但是用台式机访问时则是正常显示页面。笔记本出现空白页面时,每次需要用鼠标点击一下弹出的窗口才会正常显示页面。猜测是笔记本屏幕或分辨率太低,layer open的高度无法自适应。

解决方法:1:当页面加载完成后,用js写一个自动触发方法,模拟鼠标点击窗口的某个标签。

                  2:获取layer open的iframe的css高度,然后把高度加1。最后再把新高度赋值给iframe

推荐使用“代码2”

代码1:可以正常显示页面,但是有缺陷setTimeout时间短不起作用,时间长体验感不好。去掉setTimeout有时会失败,并且点击普通的文本框并不起作用,只有点击页面加载时动态赋值的文本框,或iframe标签的位置才起作用。

       window.onload = function(){
                setTimeout(function(){
                       autoClick('id字符串')
                },3000)
        }

        //自动点击的方法 clickId 点击事件的id属性值  字符串类型
        function autoClick(clickId) {
                    // IE
                    if (document.all) {
                        document.getElementById(clickId).click();
                    }
                    // 其它浏览器
                    else {
                        var e = document.createEvent("MouseEvents");
                        e.initEvent("click", true, true);
                        document.getElementById(clickId).dispatchEvent(e);
                        //console.log(document.getElementById(clickId).dispatchEvent(e))
                    }
        }

代码2:推荐使用

        $(function(){

                   //获取当前窗口的iframe对象
                   var iframe=window.getIframeByElement(document.body);

                   //获取css高度
                   var height = iframe.style.height;

                   //截取px前面的数字,并转成int类型。   
                   var intHeight =  parseInt(height.substr(0,height.length-2))

                   //int类型的高度加1    
                   var newHeight = intHeight+1

                   //把新高度赋值给iframe    
                   $(iframe).css('height',newHeight+'px')
            });
        })

        function getIframeByElement(element){
            var iframe;
            $("iframe", window.parent.document).each(function(){
                if(element.ownerDocument === this.contentWindow.document) {
                    iframe = this;
                }
                return !iframe;
            });
            return iframe;
        }

        

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值