<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml" >

 <head>

     <title>Parent Page</title>

         <script language="javascript" type="text/javascript">

             function parenttest() {

                 alert("这是父页面的方法！");

             }

             function btnClick() {

                 document.getElementById("childframe").contentWindow.childtest();

             }

     </script>

 </head>

 <body>

    <div style="margin:auto;">

        <h1>This is the Parent Page.</h1>

        <input type="button" value="调用子页面的方法"  onclick="btnClick()"/>

     </div>

     <div style="margin:auto;">

        <iframe style="width:300px; height:300px;" id="childframe" src="ChildPage.html"></iframe>

     </div>

 </body>

 </html>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml" >

 <head>

     <title>Child Page</title>

     <script language="javascript" type="text/javascript">

       function childtest() {

           alert("这是子页面的方法！");

       }

       function btnClick() {

           window.parent.parenttest();

       }

     </script>

 </head>

 <body>

    <div style="margin:auto;">

        <h1>This is the Child Page.</h1>

        <input type="button" value="调用父页面的方法" onclick="btnClick()"/>

     </div>

 </body>

 </html>

iframe 父页面与子页面之间的方法的相互调用的更多相关文章

  1. iframe父窗口和子窗口之间的调用

    1>父窗口获取子窗口 js方法 document.getElementById('if1').contentWindow.document: window.frames["if1&qu ...

  2. jquery、js调用iframe父窗口与子窗口元素的方法整理

    1. jquery 在iframe子页面获取父页面元素代码如下: $("#objid", parent.document) 2. jquery在父页面 获取iframe子页面的元素 ...

  3. iframe 父页面与子页面之间的方法的相互调用【转】

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. JQuery操作iframe父页面与子页面的元素与方法

    JQuery操作iframe父页面与子页面的元素与方法 JQUERY IFRAME 下面简单使用Jquery来操作iframe的一些记录,这个使用纯JS也可以实现. 第一.在iframe中查找父页面元 ...

  5. Iframe父页面与子页面之间的调用

    原文:Iframe父页面与子页面之间的调用 Iframe父页面与子页面之间的调用 专业词语解释如下:     Iframe:iframe元素是文档中的文档.     window对象: 浏览器会在其打 ...

  6. Iframe父页面与子页面之间的相互调用

    iframe元素就是文档中的文档. window对象: 浏览器会在其打开一个HTML文档时创建一个对应的window对象.但是,如果一个文档定义了一个或者多个框架(即:包含一个或者多个frame或者i ...

  7. iframe 框架 父页面与子界面之间的变量、函数、元素获取

    1.获取页面上的iframe 1-1. document.getElementById('iframeId'): 1-2. window.frames[0].window.frames['frameN ...

  8. IFrame父页面和子页面的交互

    现在在页面里面用到iframe的情况越来越少了,但有时还是避免不了,甚至这些页面之间还需要用js来做交互,那么这些页面如何操作彼此的dom呢?下面将会逐步介绍. 1.父页面操作子页面里面的dom 下面 ...

  9. js父页面和子页面之间传值

    今天和朋友一块讨论,怎样通过js在父页面和子页面之间传值的问题,总结例如以下: 需求描写叙述:父页面有多个子页面.实如今父页面点击子页面,传值到子页面. 看着非常easy,试了好久.主要纠结在怎样获取 ...

随机推荐

  1. Azure IoT 技术研究系列5-Azure IoT Hub与Event Hub比较

    上篇博文中,我们介绍了Azure IoT Hub的使用配额和缩放级别: Azure IoT 技术研究系列4-Azure IoT Hub的配额及缩放级别 本文中,我们比较一下Azure IoT Hub和 ...

  2. 让Cocos2dx中的TestCPP中的Box2dTest运行起来

    一般而言,如果你导入TestCPP到VS2012中去后,会编译十几分钟才会出现窗口界面,这是包含Cocos2dx所有功能的一个demo,功能非常齐全强大,里面有两个关于Box2d的测试案例,一个是Bo ...

  3. Java：构造器，构造代码块，静态代码块的执行顺序

    1.构造器:与类同名且没有返回值,用来初始化类属性: 构造器又分为无参构造器和有参构造器 1.1:无参构造器 public class Contruction{ ...属性... public Con ...

  4. java文件创建和删除

    流的操作在项目开发中用的很普遍,虽然每次在网上都可以百度到,但是总感觉心里不踏实,对此,关于流的操作做一个详细的总结--- 1.根据数据的流向来分:输出流:是用来写数据的,是由程序(内存)---> ...

  5. LeetCode 题解（一）：Two Sum

    LeetCode : two sum 第一次写博客,算是熟悉这些编辑环境吧,本来是打算在csdn上用markdown写的,结果改了博客介绍就被关闭了,晕死...好了,话不多说,今天打算拿LeetCod ...

  6. spoj 694. Distinct Substrings 后缀数组求不同子串的个数

    题目链接:http://www.spoj.com/problems/DISUBSTR/ 思路: 每个子串一定是某个后缀的前缀,那么原问题等价于求所有后缀之间的不相同的前缀的个数.如果所有的后缀按照su ...

  7. cgroup原理简析:vfs文件系统

    要了解cgroup实现原理,必须先了解下vfs(虚拟文件系统).因为cgroup通过vfs向用户层提供接口,用户层通过挂载,创建目录,读写文件的方式与cgroup交互.因为是介绍cgroup的文章,因 ...

  8. 自己实现的一个简单的EF框架（反射实现）

    我实现了一个简单的EF框架,主要用于操纵数据库.实现了对数据库的基本操纵--CRUD 这是项目结构 这是一个 core 下的 DLL 写了一个数据库工厂,用于执行sql语句.调用sql语句工厂 写了一 ...

  9. 单行 JS 实现移动端金钱格式的输入规则

    金钱格式检验属于很普通的需求,记得工作中第一次遇到这个需求的时候,还不太会写正则表达式,搜到了一个类似的解决方案,看着正则的文档改成了自己需要的形式. 但是用户的输入操作是任意的,只是显示提示信息,这 ...

  10. 探索Gallery和ImageSwitcher布局

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layo ...