我们使用Frame可以在浏览器窗口同时显示多个网页。每个Frame里设定一个网页,每个Frame里的网页相互独立。但是frame之间如何相互控制,我这里做了小列子来说明他们的关系。大致有两种情况,第一种是frameset 中嵌套frame,第二种是html(或jsp等)中嵌套iframe。两种情况基本类似,下面举例说明第二种情况:
请看代码清单:
frame.jsp
<%@ page language="java" pageEncoding="utf-8"%>
<script type="text/javascript">
function controlChildren(){
var childWindow1 = document.frames['frame1']; //获得第一个窗口对象
var childWindow2 = document.frames['frame2']; //获得第二个窗口对象
alert("I can control my child");
childWindow1.document.all["text1"].value="parent set my value=text1";
childWindow2.document.all["text2"].value="parent set my value=text2";
}
</script>
<frameset>
<frame src="test.jsp" name="frame1" >
<frame src="index.jsp" name="frame1" >
</frameset>
<BODY>
<div>parent frame</div>
<div>
<input type="text" id="text" value="" size="25">
<input type="button" name="button" id="button" value="controlChild1Frame" onClick="controlChildren();">
<iframe id="frame1" name="frame1" src="frame1.jsp"></iframe>
<iframe id="frame2" name="frame2" src="frame2.jsp"></iframe>
</div>
</BODY>
frame1.jsp(代码)
<BODY>
<div>child1 frame</div>
<input name="text1" id="text1" type="text" value="" size="25">
</BODY>
frame2.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<script type="text/javascript">
function controlParent(){
alert("I can control my parent");
parent.document.all["text"].value="my child set my value=text";
}
function controlOtherFrame(){
alert("I can control my brother");
var brotherWindow = parent.frames['frame1'];
brotherWindow.document.all["text1"].value="my brother set my value=text1";
}
</script>
<BODY>
<div>child2 frame</div>
<input name="text2" id="text2" type="text" value="" size="25">
<input name="button1" id="button1" type="button" value="controlParentFrame" onClick=" controlParent();">
<input name="button2" id="button2" type="button" value="controlChild1Frame" onClick=" controlOtherFrame();">
</BODY>
运行一下,能看到结果,一目了然.其实每个窗体的document对象都有一个数组的属性,即frames,通过该数组可以很容易的访问到其儿子窗体,当然儿子窗体也可以通过parent来访问其父窗体。
第一种情况补充:
取得上层frame: window.parent
取得上上层frame: window.parent.parent
取得和自己frame同级别的frame: window.parent.frames[被操作的frame的name]
改变和自己frame同级别frame的链接: window.parent.frames[被操作的framename].location.href ='新的链接'
分享到:
相关推荐
frame与frame之间如何用JavaScript传值
xr-frame案例实现兄弟组件传值通信
NULL 博文链接:https://penghuaiyi.iteye.com/blog/366458
一个页面内的多个iframe之间相互传值 ,相互调用js的例子,帮助大家更加好的利用这个小例子。附上源码。
在iframe、frame之间,js的相互访问、修改
在jsp页面中,frame之间以及子页面和父页面间参数是如何传递的?
C语言头文件 FRAMEC语言头文件 FRAMEC语言头文件 FRAMEC语言头文件 FRAMEC语言头文件 FRAMEC语言头文件 FRAMEC语言头文件 FRAMEC语言头文件 FRAMEC语言头文件 FRAMEC语言头文件 FRAMEC语言头文件 FRAMEC语言头文件 ...
frame,iframe,中的js的相互访问示例 frame,iframe,中的js的相互访问示例
MFC源代码 FRAME2.03MFC源代码 FRAME2.03MFC源代码 FRAME2.03MFC源代码 FRAME2.03MFC源代码 FRAME2.03MFC源代码 FRAME2.03MFC源代码 FRAME2.03MFC源代码 FRAME2.03MFC源代码 FRAME2.03MFC源代码 FRAME2.03MFC源代码 ...
MFC源代码 FRAME7.03MFC源代码 FRAME7.03MFC源代码 FRAME7.03MFC源代码 FRAME7.03MFC源代码 FRAME7.03MFC源代码 FRAME7.03MFC源代码 FRAME7.03MFC源代码 FRAME7.03MFC源代码 FRAME7.03MFC源代码 FRAME7.03MFC源代码 ...
Delphi中frame的使用Delphi中frame的使用Delphi中frame的使用Delphi中frame的使用Delphi中frame的使用
本文实例讲述了javascirpt实现2个iframe之间传值的方法。分享给大家供大家参考,具体如下: index.htm <body> <td width=100%><iframe src=iframe1.htm name=aa></iframe> ...
wxPython的应用入口是在wx.App()实现的,在OnInit()函数中创建要显示的Frame对象,在wx.App子类中实现界面刷新的函数update(),并将其传递给新创建的Frame对象,在Frame需要触发Frame更新的时候,通过这个回调函数...
例如页面A内有frameA,frameA内加载页面B,页面B内又有frameB,frameB内又加载页面C。。。一直嵌套,网上的方法只是根据ID可以获取第一层的frame,以上代码解决获取各层的frame加载的页面内的frame及其内部元素,...
KVO监听UI控件的frame变化,kVO的简单使用
js中top parent frame概述及案例应用.docx
本文从改线的角度出发,改造对象是迎广的H-Frame mini机箱,在它刚刚上市的时候笔者就对这款机箱十分迷恋,当拿到实物的时候更是
Frame relay Frame relay Frame relay Frame relay Frame relay Frame relay Frame relay Frame relay
点击劫持:X-Frame-Options头缺失 in a frame because it set 'X-Frame-Options' to 'deny'
MFC源代码 FRAME3.03MFC源代码 FRAME3.03MFC源代码 FRAME3.03MFC源代码 FRAME3.03MFC源代码 FRAME3.03MFC源代码 FRAME3.03MFC源代码 FRAME3.03MFC源代码 FRAME3.03MFC源代码 FRAME3.03MFC源代码 FRAME3.03MFC源代码 ...