今天写的程序涉及到JS框架传值的问题,这些是我找到的一些资料
下面主页面和子页面互相传值的DEMO 如果仅仅需要子页面触发主页面的函数 仅需 [ parent.window.你的函数 ] 就可以了
DOM方法:
父窗口操作IFRAME:window.frames["iframeSon"].document
IFRAME操作父窗口: window.parent.document
jquery方法:
在父窗口中操作 选中IFRAME中的所有输入框: $(window.frames["iframeSon"].document).find(”:text”);
在IFRAME中操作 选中父窗口中的所有输入框:$(window.parent.document).find(”:text”);
iframe 框架的 HTML:<iframe src=”test.html” id=”iframeSon” width=”700″ height=”300″ frameborder=”0″ scrolling=”auto”& gt;</iframe>
细心的朋友一下就能理解,原理其实很简单,就是用到了$(DOM对象)转换成jquery对象。
例子:
主页面
<title>主页面</title>
<script type="text/javascript" src="css_js/jquery/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
function showSubValue(){
//var v = window.frames[0].document.getElementByIdx_x("subdiv1").innerHTML;
//alert(v);
var o = $(window.frames[0].document).find(":div#subdiv1");
alert(o.html());
}
</script>
</head>
<body>
<div id="mainDiv">主页面测试数据</div>
<input type="button" value="查看子页面数据" onclick="showSubValue();"/>
<iframe src="sub.html" width="300" height="300"></iframe>
</body>
</html>
子页面:
<script type="text/javascript" src="css_js/jquery/jquery-1.3.2.min.js"></script>
<title>子页面</title>
<script type="text/javascript">
function showMainValue(){
//dom方式
//var v = window.parent.document.getElementByIdx_x("mainDiv").innerHTML;
//alert(v);
//window.parent.document.getElementByIdx_x("mainDiv").innerHTML = "修改后的主页面数据";
//jquery方式
var o = $(window.parent.document).find(":div#mainDiv");
alert(o.html());
}
</script>
</head>
<body>
<div id="subdiv1">子页面测试数据</div>
<input type="button" value="显示父页面数据" onclick="showMainValue();"/>
</body>
</html>
分享到:
相关推荐
主要介绍了js实现ifram取父窗口URL地址的方法,是javascript操作window.parent对象非常典型的应用技巧,需要的朋友可以参考下
本篇主要是对JS操作iframe里的dom进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
web中使用IFRAM实现自适应高度,文档简洁,适合快速学习。
子页面刷新父页面
ifram自适应高度兼容性非常强,本人经过这个浏览器的测试都OK
主要介绍了JavaScript使ifram跨域相互访问及与PHP通信的实例,同时对同域间的访问也作了详细的演示,需要的朋友可以参考下
主要介绍了Jquery方式如何获取iframe页面中的Dom元素,需要的朋友可以参考下
iframe子父页面调用js函数示例.docx
但是,如果一个文档定义了一个或者多个框架(即:包含一个或者多个frame或者iframe标签),浏览器就会为原始文档创建一个window对象,再为每个iframe创建额外的window对象,这些额外的window对象是原始窗口的子窗口。...
在jsp页面中,frame之间以及子页面和父页面间参数是如何传递的?
js操作iframe的一些知识;
此文件中介绍了三种在asp.net中运用ifram时刷新页面的方法!
jquery fancybox弹出层插件支持Ajax,ifram jquery fancybox弹出层插件支持Ajax,ifram jquery fancybox弹出层插件支持Ajax,ifram jquery fancybox弹出层插件支持Ajax,ifram
ifram jQuery-online xuanzuowei(动态加载) seat
本文实例讲述了js改变Iframe中Src的方法。分享给大家供大家参考。具体实现方法如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title></title>...
<script src="jquery-1.8.3.min.js" type="text/javascript"> <script src="showcenterdiv.js" type="text/javascript"> 指定在要弹出的链接: $(document).ready(function () { $('.EditandAdd').centerF(); });...
动态的改变IFrame的高度,实现IFrame自动伸展,父页面也自动神缩 原理: 在IFrame子页面一加载的时候,调用父IFrame对象,改变其高度 具体实现一: 1、在IFrame的具体页面(就是子页面),添加JavaScript 代码如下: ...