iframe子父页面调用js函数示例_javascript技巧
程序员文章站
2022-04-07 08:13:18
...
1、iframe子页面调用父页面js函数
子页面调用父页面函数只需要写上window.praent就可以了。比如调用a()函数,就写成:
window.parent.a();
子页面取父页面中的标签中的值,比如该标签的id为“test”,则:
window.parent.document.getElementById("test").value;
jQuery方法为:
$(window.parent.document).contents().find("test").val();
但是我在chrome浏览器下却发现此方法无效了!查了半天才了解,在chrome 5+中,window.parent无法在file://协议中运行,但是发布了之后http://协议下是可以运行的。此方法支持ie、firefox浏览器。
2、iframe父页面调用子页面js函数
这个就稍微复杂一些,下面的方法支持ie和firefox浏览器:
document.getElementById('ifrtest').contentWindow.b();
子页面取父页面中的标签中的值,比如该标签的id为“test”,则:
document.getElementById("test").value;
注:ifrtest是iframe框架的id,b()为子页面js函数。contentWindow属性是指定的frame或者iframe所在的window对象,IE下可以省略。
子页面调用父页面函数只需要写上window.praent就可以了。比如调用a()函数,就写成:
复制代码 代码如下:
window.parent.a();
子页面取父页面中的标签中的值,比如该标签的id为“test”,则:
复制代码 代码如下:
window.parent.document.getElementById("test").value;
jQuery方法为:
$(window.parent.document).contents().find("test").val();
但是我在chrome浏览器下却发现此方法无效了!查了半天才了解,在chrome 5+中,window.parent无法在file://协议中运行,但是发布了之后http://协议下是可以运行的。此方法支持ie、firefox浏览器。
2、iframe父页面调用子页面js函数
复制代码 代码如下:
这个就稍微复杂一些,下面的方法支持ie和firefox浏览器:
document.getElementById('ifrtest').contentWindow.b();
子页面取父页面中的标签中的值,比如该标签的id为“test”,则:
document.getElementById("test").value;
注:ifrtest是iframe框架的id,b()为子页面js函数。contentWindow属性是指定的frame或者iframe所在的window对象,IE下可以省略。
上一篇: Yii2实现表单上传文件功能
下一篇: php如何实现表单上传文件
推荐阅读
-
iframe子页面与父页面在同域或不同域下的js通信_javascript技巧
-
iframe调用父页面函数示例详解_javascript技巧
-
iframe里面的页面调用父窗口,左右窗口js函数的方法 CC++C#HTML.net
-
iframe里面的页面调用父窗口,左右窗口js函数的方法 CC++C#HTML.net
-
子窗体与父窗体传值示例js代码_javascript技巧
-
Chrome下ifame父窗口调用子窗口的问题示例探讨_javascript技巧
-
js匿名函数的调用示例(形式多种多样)_javascript技巧
-
iframe子页面与父页面在同域或不同域下的js通信_javascript技巧
-
JS父页面与子页面相互传值方法_javascript技巧
-
iframe子父页面调用js函数示例