在项目中难免会遇到这样一个问题就是页面引入了IFrame并且需要父页面调用子页面函数或者子页面需要调用父页面函数。比如说：现在有两个页面parent.html和child.html。其中parent.html中含有IFrame并且IFrame指向child.html。现在需要在parent.html/child.html中调用child.html/parent.html的一个js方法。

具体的代码实现如下：

parent.html

<html>
<head>
<script type="text/javascript">
　　function parent_click(){
　　　　alert("来自父页面");
　　}
</script>
</head>
<body>
　　<input type="button" value="调用本页面函数" onclick="parent_click();" />
　　<input type="button" value="调用子页面函数" onclick='window.frames["childPage"].child_click();' />
　　<iframe id="childPage" name="childPage" src="inner.html" width="100%" frameborder="0"></iframe>
</body>
</html>

child.html 

<html>
<head>
<script type="text/javascript">
　　function child_click(){
　　　　alert("调用的子页面函数");
　　}
</script>
</head>
<body>
　　<input type="button" value="调用父页面函数" onclick='parent.window.parent_click();' />
　　<input type="button" value="调用本页面函数" onclick="child_click();" />
</body>
</html>

http://blog.csdn.net/qingfeilee/article/details/7280171

 

iframe跨页面调用函数的更多相关文章

  1. iframe子页面调用父页面javascript函数的方法

    1.iframe子页面调用 父页面js函数 子页面调用父页面函数只需要写上window.parent就可以了.比如调用a()函数,就写成: window.parent.a(); 2.iframe父页面 ...

  2. Javscript调用iframe框架页面中函数的方法

    Javscript调用iframe框架页面中函数的方法,可以实现iframe之间传值或修改值了, 访问iframe里面的函数: window.frames['CallCenter_iframe'].h ...

  3. iframe标签的子父页面调用函数和属性

    在使用iframe标签时,总想通过子页面调用父页面的一些方法和属性.今天终于发现了. 1在父页面写一个函数 //让子页面来调用此方法,控制导航栏 function childfunc(){ alert ...

  4. JS备忘--子父页面获取元素属性、显示时间，iframe之间互相调用函数

    //页面加载完成后执行 $(function () { getHW();}); //当用户改变浏览器大小改变时触发 $(window).resize(function () { setHW(); }) ...

  5. window.frames && iframe 跨页面通信

    1.定义 frames[]是窗口中所有命名的框架组成的数组.这个数组的每个元素都是一个Window对象,对应于窗口中的一个框架. 2.用法 假设iframe 是一个以存在的 iframe 的 ID 和 ...

  6. [JSP][JSTL]页面调用函数--它${fn：}内置函数、是推断字符串是空的、更换车厢

    页面中调用函数--之${fn:}内置函数 函数描写叙述 fn:contains(string, substring) 假设參数string中包括參数substring,返回true fn:contai ...

  7. iframe 父页面调用子页面的vue方法

                    父页面代码:            html: <div id="app"> //省略业务代码x行..... <iframe sr ...

  8. c语言跨文件调用函数中声明的变量

    转载:weixin_33885253 变量的作用域 变量根据其作用域有全局变量和局部变量之分.全局变量作用域是整个文件,并且可以使用关键字extern达到跨文件调用的目的.但是局部变量值作用于它当前所 ...

  9. iframe父子页面调用小结

     子页面调用父页面 $('#Id', window.parent.document); //调用父页面元素 window.parent.func1(); //调用父页面方法  (子页面同理,需将js方 ...

随机推荐

  1. KVC(Key-Value-Coding)和KVO(Key-Value-Observer)

    KVC(Key-Value-Coding)和KVO(Key-Value-Observer) 目录 概述 KVC的基本用法 KVC的运用 KVO的基本用法 KVO的运用 概述 键-值编码是一个用于间接访 ...

  2. Servlet------>jsp自定义标签2（让标签体不显示）

    自定义标签能做什么: 1.移除java代码 2.控制jsp页面某一部分是否执行 3.控制整个jsp是否执行 3.jsp内容重复输出 4.修改jsp内容输出 2.控制jsp页面某一部分是否执行 tag1 ...

  3. application/x-protobuf payload加密 知乎

  4. 牛B三人组-快速排序-堆排序-归并排序

    快速排序 随便取个数,作为标志值,这里就默认为索引位置为0的值 记录左索引和右索引,从右往左找比标志值小的,小值和左索引值交换,右索引变化,然后从左往右找比标志值大的,大值和右索引值交换,左索引变化 ...

  5. 解决Xshell中使用hbase shell backspace无法删除

    进入到XShell 文件 –> 属性 –> 终端 –> 键盘 在 DELETE键序列 和 BACKSPACE键序列 中都选择 ASCII 127 最后进入 Hbase 命令行测试,可 ...

  6. kvm_read_guest*函数分析

    2017-06-30 在KVM中基于其搞特权及,可以透明的读写客户机的内存信息,为此KVM提供了一套API,这里姑且称之为kvm_read_guest_virt*/kvm_write_guest_vi ...

  7. Ubentu下安装Docker

    具体可以查看Docker官网,我是在服务器上面操作 1,sudo apt-get install -y apt-transport-https ca-certificates curl softwar ...

  8. C# 中利用 Conditional 定义条件方法

    利用 Conditional 属性,程序员可以定义条件方法.Conditional 属性通过测试条件编译符号来确定适用的条件.当运行到一个条件方法调用时,是否执行该调用,要根据出现该调用时是否已定义了 ...

  9. java-mybaits-00502-案例-映射分析-一对一、一对多、多对多

    1.一对一查询[类属性即可,association ] 案例:查询所有订单信息,关联查询下单用户信息.   注意:因为一个订单信息只会是一个人下的订单,所以从查询订单信息出发关联查询用户信息为一对一查 ...

  10. layer插件的常用实例

    layer.msg(提示信息, {time:1000, icon:5, shift:6}, 回调方法); layer.alert(提示信息, function(index){ // 回调方法 laye ...