在做一个父窗口开启子窗口并且在子窗口关闭的时候调用父窗口的方法，达到局部刷新的目的。

　　父窗口：

 <!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</title>

   <script type="text/javascript">

     var parentPara='parent';

     function parentFunction() {

       alert(parentPara);

     }

   </script>

 </head>

 <body>

   <button onclick="parentFunction()">显示变量值</button>

   <button onclick="window.open('child.html')">打开新窗口</button>

 </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</title>

   <script type="text/javascript">

     function modify() {

       opener.parentPara='child';

     }

   </script>

 </head>

 <body>

   <button onclick="opener.parentFunction()">调用父页面的方法</button>

   <button onclick="modify()">更改父页面中变量的值</button>

 </body>

 </html>

　　子页面是父页面的一个iframe

　　父页面：

 <!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</title>

   <script type="text/javascript">

     function fill() {

       //alert(frame1.window.childPara);  //显示frame1内的变量值

       var str=document.getElementById('txt1').value; //获得文本框内输入的值

       frame1.window.div1.innerHTML=str; //将值填入子页面的一个div中

     }

   </script>

 </head>

 <body>

   <div style="background-color:yellow;width:300px;height:300px;">

     父页面

     <iframe id="frame1" src="child.html" frameborder="0" scrolling="no" width="120px" height="120px"></iframe>

     <br/><br/><br/><br/>

     <input id="txt1" type="text"/>

     <button onclick="fill()">将文本框内值填充入子界面</button>

   </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</title>

   <script type="text/javascript">

     function fun() {

       parent.fill();

     }

   </script>

 </head>

 <body>

   <div style="background-color:lightblue;width:100px;height:100px;">

     <b>子页面</b><br/>

     <a href="#" onclick="fun()">同父页面按钮</a>

     <div id="div1" style="color:red;">

     </div>

   </div>

 </body>

 </html>

　　刷新父页面时，其中的iframe也会随之刷新；刷新iframe时，父页面不会刷新。

　　另外，如果是在angularJS中的一个模块调用另一个模块的方法：主要思路是获取另一模块的angular和document，然后用angular.element(document.getElementById("aaa"));

其中：var angular = window.opener.angular;var document = window.opener.document;具体情况视实际情况在获取。

JavaScript子窗口调用父窗口变量和函数的方法的更多相关文章

  1. winform子窗口调用父窗口的控件及方法-一般调用

    首先新建一个窗体应用程序,在项目属性中点击右键->添加->添加新项,选择Windows窗体->添加. 在Form1和Form2窗口中各添加一个按钮,并双击添加事件处理函数:     ...

  2. Qt 代码： 子窗口调用父窗口（其实就是用指针直接访问）

    之前的 Qt 编程大多只涉及简单的多窗口,并未染指窗口间的传值交互,想来还是“涉世未深”,对 Qt 的理解.应用还需殷勤努力. 这次的问题是这样的,我想要实现一个类似QQ.阿里旺旺的聊天客户端,在弹出 ...

  3. js中子窗口调用父窗口中的变量、函数

  4. window.open子窗口获取父窗口的值

    //子窗口获取父窗口id的值 window.opener.document.getElementById("id").value; //子窗口调用父窗口的函数 window.ope ...

  5. iframe里面的页面调用父窗口,左右窗口js函数的方法

      iframe里面的页面调用父窗口,左右窗口js函数的方法 实现iframe内部页面直接调用该iframe所属父窗口自定义函数的方法. 比如有A窗口,A内有个IFRAME B,B里面的装载的是C页面 ...

  6. JS 在open打开的子窗口页面中调用父窗口页面的JS方法

    需求的情景如下: 1:做新增或修改等操作的时候打开一个新的浏览器窗口(使用window.open(参数等)方法) 2:在新增或修改等的页面上有返回按钮.重置按钮.保存按钮,对于返回就直接关闭此窗口(使 ...

  7. JavaScript窗口打开与关闭及如何使用opener使子窗口对父窗口进行操作

    一.打开与关闭窗口 1.打开窗口:可以使用window对象中的Open()方法. newWindow = window.open(url,windowname,location); 参数说明: url ...

  8. 转-JS子窗口创建父窗口操作父窗口

    Javascript弹出子窗口  可以通过多种方式实现,下面介绍几种方法 (1) 通过window对象的open()方法,open()方法将会产生一个新的window窗口对象 其用法为: window ...

  9. MFC子窗口和父窗口

    转载声明: 本文转载自:http://www.cnblogs.com/BeyondTechnology/archive/2011/03/25/1995934.html 感谢BeyondTechnolo ...

随机推荐

  1. React.js入门必须知道的那些事

    首先,React.js是facebook在2013年5月开源的一个前端框架,React不是一个MVC框架,它是构建易于可重复调用的web组件,侧重于UI, 也就是view层, React为了更高超的性 ...

  2. 我的EF功能

    由来 话说这个功能想法由来与java的Hibernate功能,我需要一个类和数据库映射,很简单的写一个实体类简单配置一下就ok了, 很是方便, package com.game.po.log; imp ...

  3. 如果你也会C#，那不妨了解下F#（6）：面向对象编程之“类”

    前言 面向对象的思想已经非常成熟,而使用C#的程序员对面向对象也是非常熟悉,所以我就不对面向对象进行介绍了,在这篇文章中将只会介绍面向对象在F#中的使用. F#是支持面向对象的函数式编程语言,所以你用 ...

  4. Asp.Net Core 项目实战之权限管理系统（5） 用户登录

    0 Asp.Net Core 项目实战之权限管理系统(0) 无中生有 1 Asp.Net Core 项目实战之权限管理系统(1) 使用AdminLTE搭建前端 2 Asp.Net Core 项目实战之 ...

  5. 使用STM32F4的CCM内存

    使用STM32F4的CCM内存http://www.stmcu.org/module/forum/forum.php?mod=viewthread&tid=604814&fromuid ...

  6. 关系数据库SQL之可编程性触发器

    前言 前面关系数据库SQL之可编程性函数(用户自定义函数)一文提到关系型数据库提供了可编程性的函数.存储过程.事务.触发器及游标,前文已介绍了函数.存储过程.事务,本文来介绍一下触发器的使用.(还是以 ...

  7. MAC远程连接服务器，不需要输入密码的配置方式

    cd ~/.ssh #没有则需要创建一个. mkdir ~/.ssh ssh-keygen -t rsa cd ~/.ssh scp id_rsa.pub root@IP地址:~/.ssh/id_rs ...

  8. Quartz框架(第一版)

    任务调度 在企业级应用中,经常会制定一些"计划任务",即在某个时间点做某件事情 核心是以时间为关注点,即在一个特定的时间点,系统执行指定的一个操作 任务调度涉及多线程并发.线程池维 ...

  9. JS eval()函数的一些见解

    一.eval是基本使用规则 1 eval() 函数可计算某个字符串,并执行其中的的 JavaScript 代码. 2 eval(string) 3 string必需.要计算的字符串,其中含有要计算的 ...

  10. SharePoint 2013 日期和时间字段格式设置

    前言 最近碰到一个需求,用户希望修改日期和时间字段的格式,因为自己的环境是英文的,默认的时间格式是[月/日/年]这样的格式,我也是碰到这个问题才知道,这是美式的时间格式,然而用户希望变成英式的时间格式 ...