iframe使用小记

1.HTML

<ul>
	<li>
	    <a target="ifra" href="1.html">第一个html</a>
	</li>
	<li>
	    <a target="ifra" href="2.html">第二个html</a>
	</li>
</ul>
<iframe width="100%" height="100%" marginheight="0" marginwidth="0" frameborder="0"  name="ifra" id="ifra" src="" ></iframe>

2.src为路径,当点击切换路径,iframe里填写的路径是页面加载时默认加载的页面;

3.iframe加载会涉及高度的设置问题,如果设置太高则纵向连同头部滚动不太好,如果不设置高度则会有默认高度值很小,体验效果很不好,所以需要动态设置高度

var iframe = $("#ifra");
//绑定load事件(当iframe加载完再计算高度)
iframe.bind('load', function() {
	//这是相同头部
	var topHeight = $(".main-header").outerHeight();
	//这是window高度(两者求差值)
	var wh = $(window).height() - topHeight;
	var bh =iframe.contents().find("body").height()+30;
	if(bh>wh){
		wh=bh;
	}			
	$(this).height(wh);

});

4.当sessionkey失效时,点击iframe里的HTML这个页面都要跳转到登录页面,这时相当于父集页面跳转,使用

    window.top.location.href = 'login.html'

最佳

(还可使用window.parent.location:

①如果parent外还有框架则parent就不是自身了;

②如果你使用的是window.top.location虽然有top但它就是最外层不影响;

猜你喜欢

转载自blog.csdn.net/hangge0111/article/details/80828778
今日推荐