因为我要做一个页面,要实现当浏览器的大小发生改变时获取到浏览器的高度,然后传入iframe引入的子页面中,思前想后用了许多方法都不行~最后突然想到了cookie,就尝试着试了一下,没想到还真行~~
首先,在主页面listMenu.jsp写入如下代码:
//写cookies
function setCookie(name,value){
var Days = 30;
var exp = new Date();
exp.setTime(exp.getTime() + Days*24*60*60*1000);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString()+";path=/ficrm-front";
}
$(window).resize(function(){//浏览器发生改变触发事件
var browserWidth = document.documentElement.clientWidth; //可见区域宽度
var iframeHeight = document.documentElement.clientHeight-108; //可见区域高度
setCookie("cookie_iframeHeight",iframeHeight);
//console.log('宽度:'+browserWidth+'高度:'+iframeHeight);
});
当浏览器窗口发生改变时把高度实时的写入cookie中。注意那个108是根据我自己需要才减去的话,如果需要获取浏览器的高度就不要减。还有就是setCookie方法里面的path值为你项目的根目录~~上面写的是我自己的,可别也复制上去了~
接下来需要在iframe页面中写入如下代码:
$(window).resize(function(){
//获取cookie
function getCookie(name){
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr != null)
return unescape(arr[2]);
return null;
}
var pageAutoHeight = getCookie("cookie_iframeHeight");
$(".pageAuto").css({"overflow-y":"auto","height":pageAutoHeight});
})
通过getCookie("cookie_iframeHeight");获取到在主页面设置的高度值。