在项目中难免会遇到这样一个问题就是页面引入了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. css从中挖去一个圆

    始终居中: width: 300px; position: fixed; /*在可视区域的上下左右居中*/ top: calc(50vh - 200px); left: calc(50vw - 150 ...

  2. 用Dialog 做自定义动画，加播放监听

    final Dialog customDialog = new Dialog(this); customDialog.setTitle(R.string.attention); customDialo ...

  3. jQuery Mobile 总结

    转载  孟祥月 博客 http://blog.cshttp://blog.csdn.net/mengxiangyue/article/category/1313478/2dn.http://blog. ...

  4. npm install命令对package-lock.json文件自动做了一些额外的更新

    今天我使用 npm 命令给项目安装file-saver,通过git却发现package-lock.json中除了file-saver组件之外的其他组件的记录也被改了 npm为何会自动做这些更改呢,又如 ...

  5. CF #301 E:Infinite Inversions（逆序数，树状数组）

    A-Combination Lock  B-School Marks   C-Ice Cave   D-Bad Luck Island   E-Infinite Inversions E:Infini ...

  6. Theme Section---hdu4763(kmp, Next数组的运用)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4763 题意就是求s串中满足EAEBE格式的E的最大长度:我们可以枚举前缀和后缀的所有匹配(k)看是否在 ...

  7. URL地址中的字符串转换

    url出现了有+,空格,/,?,%,#,&,=等特殊符号的时候,可能在服务器端无法获得正确的参数值,怎么解决?解决办法将这些字符转化成服务器可以识别的字符,对应关系如下:URL字符转义 用其它 ...

  8. golang-imagick图片去除边框（黑边，白边,），添加中文字

    图片去除边框(黑边,白边) package main import ( "fmt" "github.com/gographics/imagick/imagick" ...

  9. LRU算法的Python实现

    http://flychao88.iteye.com/blog/1977653文章中介绍了常见的几种缓存淘汰策略 LRU:least recently used,最近最少使用算法.其实就是按使用时间倒 ...

  10. 【我的Android进阶之旅】Android目录过长造成错误：Failed to crunch file abc_textfield_search_activated_mtrl_alpha.9.png

    一.编译异常描述 一大早来开发一个新的需求,拉取了一个新的分支,然后导入Android Studio之后,编译就报错了,报错如下所示: 错误具体日志如下所示: Information:Gradle t ...