iframe子页面内刷新同页面中另一个iframe

IFRAME页面刷新方法

最新推荐文章于 2022-04-21 17:40:12 发布

原创最新推荐文章于 2022-04-21 17:40:12 发布 · 992 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#iframe #父页面

JavaScript 专栏收录该内容

23 篇文章

订阅专栏

本文介绍了如何在iframe页面中实现内容的刷新操作。提供了两种方法：一是直接修改iframe的src属性；二是推荐方法，在父页面中定义统一的刷新方法，并通过子页面调用该方法来实现刷新。

框架页面如下：

<div id="aa" style="float: left; height: 500px; border-right-style: solid; border-right-color: #CCCCFF; border-right-width: 2px;">
		<IFRAME id="tree" name="tree"
			src="/ScienProjectWeb/commonjsp/selectdepartment.jsp?classid=${Hthm_DefaultClassid}&user=1"
			frameBorder=0 width="248px" scrolling="auto" height="95%" allowtransparency>
		</IFRAME>
	</div>
	<div style="float: left;">
		<div id="ttr" style="scrolling: auto;height: 300px;border:1px solid blue;">
			<IFRAME id="opertop" name="opertop"
				src="/ScienProjectWeb/commonjsp/userlist.jsp"
				frameBorder="0" width="100%" scrolling="auto" height="100%" allowtransparency>
			</IFRAME>
		</div>
		<div style="height: 200px;border:1px solid blue;">
			<IFRAME id="operbottom" name="operbottom"
				src="#" frameBorder="0"
				width="100%" scrolling="auto" allowtransparency>
			</IFRAME>
		</div>
	</div>

在tree页面中想要刷新opertop页面内容，两种方法：

第一种：window.parent.document.getElementById("opertop").src=url;（有无window.都可），注意，此处不能用window.parent.frames["opertop"].src=url;

第二种（推荐，将三个页面互相传递信息的方法统一放在父页面中，集中管理）

在父页面中定义方法

function refreshframe(url)
       {
         //window.frames['opertop'].src=url;这种写法也不对，只能通过document.getElementById方式
         $('#opertop').attr("src",url);
       }

子页面中调用

parent.refreshframe(url);