因为iframe页面于包括父页面在内的其他页面通讯有跨域问题,所以只有在服务器环境下或者火狐浏览器下才能测试。

  在iframe页面调用父页面的函数采用parent,例子:在父页面有一个say()函数,在iframe页面可以这样调用parent.say();

  如果在页面内有多个iframe,可以用parent[0],parent[1]...这样定位到某个iframe。

  1、在index.html页面下有iframe1.html 和 iframe2.html。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>index</title>
</head>
<body>
<iframe name="iframe1" src="iframe1.html" id="if1" frameborder="0" width="500" height="500"></iframe>
<iframe name="iframe2" src="iframe2.html" id="if2"></iframe>
</body>
</html>

  2、iframe1.html里有自定义两个函数say()和callChild();

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>iframe1</title>
<script type="text/javascript">
function say() {
alert("来着iframe1页面");
}
function callChild()
{
parent[1].window.say();
}
</script>
</head>

<body>
<input type=button value="调用iframe2中的函数say()" onclick="callChild()">
</body>
</html>

  3、2、iframe2.html里有自定义两个函数say()和callChild();

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>iframe2</title>
<script type="text/javascript">
function say()
{
alert("来自iframe2页面");
}
function callParent() {
parent[0].say();
}

</script>
</head>
<body>

<input type=button value="调用iframe1中的say()函数" onclick="callParent()">
</body>
</html>

iframe于iframe页面之间的函数相互调用的更多相关文章

  1. Extjs Ext.ux.IFrame的用法 以及父子窗口间函数相互调用

    Extjs Ext.ux.IFrame的用法 以及父子窗口间函数相互调用 Ext.ux.IFrame Extjs官方提供的一个组件,可以很方便的使用. 这样就完成了一个简单的IFrame的使用,通过E ...

  2. C&C++——C函数与C++函数相互调用问题

    C C++相互调用 在项目中融合C和C++有时是不可避免的,在调用对方的功能函数的时候,或许会出现这样那样的问题,但只要我的C代码和我的C++代码分别都能成功编译,那其他就不是问题.近来在主程序是C语 ...

  3. iframe及与页面之间的通信

    获取iframe对象 iframe元素本身是位于父级页面中的,所以你可以像一个普通元素一样的使用和操作它 代表了iframe内容window对象是作为一个页面的属性加入到iframe中的, 为了让父级 ...

  4. iframe嵌套的页面之间传值问题

    项目中很多时候会遇到需要用 iframe 嵌套页面的情况.有时候会有这样的需求: iframe 嵌套的页面 A ,点击之后要跳到页面 B ,但是同时还需要 A 页面中的某个属性值. 此时可以先把 A ...

  5. C#代码和javascript函数相互调用

    C#代码与javaScript函数的相互调用 问:1.如何在JavaScript访问C#函数?2.如何在JavaScript访问C#变量?3.如何在C#中访问JavaScript的已有变量?4.如何在 ...

  6. 六)iframe 及父子页面之间获取元素、方法调用

    http://www.w3school.com.cn/tags/tag_iframe.asp father.html <!DOCTYPE html> <html> <he ...

  7. Layui Iframe页面间 方法的相互调用

    就是普通的iframe之间方法的调用,只是注意一下src就像 var childWindow = $(window.parent.document).find("iframe[src='/A ...

  8. 关于使用iframe的父子页面进行简单的相互传值

    当一个页面使用了iframe作为嵌套时,如何想要将父页面的数据传给iframe子页面,那iframe所指向的呢个子页面是怎么获取呢,又或者子页面的数据要给父页面使用,那么父页面又如何获取子页面的数据呢 ...

  9. js中子页面父页面方法和变量相互调用

    (1)子页面调用父页面的方法或者变量: window.parent.方法()或者变量名window.parent相当于定位到父页面 之后的操作和在父页面中写代码一样写 window.parent.aa ...

随机推荐

  1. kali切换桌面环境

    感谢大佬:https://blog.csdn.net/tao546377318/article/details/52353018 kali 是基于Debian的发行版,兼容性和软件支持都很好,默认使用 ...

  2. start方式开启服务的特点&bindService 方式开启服务的特点

      服务是在后台运行 可以理解成是没有界面的activity   定义四大组件的方式都是一样的     定义一个类继承Service     start方式开启服务的特点   特点:   (1)服务通 ...

  3. 学习Java Web篇:MVC设计模式

    一.MVC设计模式 1.什么是MVC模式 1.1.MVC -- Model View Controller模型视图控制器 1.2.Model:模型 一个功能 一般用JavaBean 1.3.View: ...

  4. 问题描述:Navicat连不上MySQL数据库

    发现Navicat连不上MySQL后我首先觉得是MySQL的服务没有打开, 然后再cmd里面 启动MySQL服务 输入: net start mysql 发现没有此服务,然我网上找了一下 先初始化My ...

  5. 05 BOM与DOM

    BOM和DOM 1. 什么是BOM和DOM 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的 ...

  6. Solution -「LOJ #138」「模板」类欧几里得算法

    \(\mathcal{Description}\)   Link.   \(T\) 组询问,每次给出 \(n,a,b,c,k_1,k_2\),求 \[\sum_{x=0}^nx^{k_1}\left\ ...

  7. Solution -「51nod 1584」加权约数和

    \(\mathcal{Description}\)   Link.   令 \(\sigma(n)\) 为 \(n\) 的约数之和.求: \[\sum_{i=1}^n\sum_{j=1}^n\max\ ...

  8. 趣谈IO多路复用的本质

    在<轻松搞懂5种IO模型>中,我发起了一个投票. 答案是[同步IO多路复用].目前,60%的朋友答对了.原因这里解释一下. 同步和异步的概念区别 同步:线程自己去获取结果.(一个线程) 异 ...

  9. 看SparkSql如何支撑企业数仓

    企业级数仓架构设计与选型的时候需要从开发的便利性.生态.解耦程度.性能. 安全这几个纬度思考.本文作者:惊帆 来自于数据平台 EMR 团队 前言 Apache Hive 经过多年的发展,目前基本已经成 ...

  10. 深入分析CVE-2021-4034及漏洞复现

    正向shell总结 一.winrm,http.sys(端口复用) 介绍 winrm WinRM全称是Windows Remote Management,是微软服务器硬件管理功能的一部分,能够对本地或远 ...