子页面访问父页面和跨iframe访问

lan13217

浏览: 496432 次
性别:

最近访客更多访客>>

jin361612388

ssj014

夜默兮

科凯20140707

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

JavaScript

XHTML HTML 框架

http://xqin.cn/temp/iframe_a.html
RIA知识库
flex
RIA

function copyValue(aim, original){
		aim.value=window.parent.parent.document.getElementById('customIf').contentWindow.getValue(original);
		
		/*
		document.getElementById("frame1").contentDocument
		alert(window.parent.parent.document.getElementById('customIf').contentDocument.getElementById('hjbs').value);
		alert(window.parent.parent.document.getElementById("MyHotFrame"));
		alert(window.parent.parent.document.getElementById('userTa').align);
		aim.value=document.getElementById(original).value;
		alter(window.parent.parent.document.getElementById('customIf').height);//.document.getElementById('hjbs').value);
		*/
	}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <title>子父双向操作</title>
 <script type="text/javascript">
 //<![CDATA[
	function test(){
		var r = Math.random();
		show(r);
		show.call(who, r);
		return false;
	}
	function show(m){
		this.document.getElementById('message').innerHTML = m;
	}
	var who = null;
	window.onload = function(){
		who = document.getElementById('ifr').contentWindow;
	}
 //]]-->
 </script>
 </head>

 <body>
	<div id="message"></div>

	<input type="button" onclick="test()" value="测试" />
	<hr/>
	<iframe src="iframe_b.html" width="400" height="200" id="ifr"></iframe>
	<pre>
		<h1>简要说明</h1>

	如果被嵌入的页面不需要去对父窗口做任何事件,
	那么在iframe_b.html时面的script这一段就可以删除掉.
	反过来也是如此,既子窗口不需要父窗口做任何事件,那么iframe_a.html里面的Script代码块就可以删除掉.

	在框架内(外)做同样的事情,可以用 functoin对象的call和applay方法来实现,不同window情况下的切换.

	既,show函数在用call(who,r)之后,在函数内部的this就指向 who 所设置的对象,在这个页面它指向的是内部的iframe,所以就改变了 iframe_b.html 里面的message的内容.

	在iframe_b里面它指向parent,所以在 iframe_b里面调用的时候,就改变了父窗口的 message的内容.
	</pre>
 </body>

</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
	<script type="text/javascript">
	//<![CDATA[
	function test(){
		var r = Math.random();
		show(r);
		show.call(who, r);
		return false;
	}
	function show(m){
		this.document.getElementById('message').innerHTML = m;
	}
	var who = null;
	window.onload = function(){
		who = parent;
	}
	//]]-->
	</script>
 </head>

 <body>
	<div id="message"></div>
	<input type="button" onclick="test()" value="测试" />
 </body>

</html>

分享到：

跨浏览器的iframe onload 事件监听 | JS 实现跨页事件响应

2009-11-24 21:17
浏览 2349
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

子页面访问父页面和跨iframe访问

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

子页面访问父页面和跨iframe访问

评论

发表评论

相关推荐

js add day

js字段转列

nashron Arttemplate

javascript 生成菜单

Example of a Javascript Closure: setTimeout Inside a For Loop

Ctrl + Key Combination – Simple Jquery Plugin

ueditor 工具栏（按钮栏）取消 浮动（悬停,漂浮.***）

JavaScript获取HTML页面源代码

编辑器

tmall T码

ext combox添加空值项

js Objec->String

js 正则测试

JavaScript的性能优化：加载和执行

时间戳转时间函数

jquery 控制 select radio checkbox input 不可修改

js正则

chrome developer tool 调试技巧

Easyui ‘Rowspan’ 为空或不是对象

HTML DOM Event 对象 方法

最近访客更多访客>>

ueditor 工具栏（按钮栏）取消浮动（悬停,漂浮.***）

HTML DOM Event 对象方法