在html中，window对象代表浏览器中一个打开的窗口，就像我们C/S中做窗体一样，在该页的window对象就是new了一个新的窗体对象。

就像做C/S开发一样，浏览器是一个软件，每一个网页都是它new的一个对象，对象与对象的信息交流只能通过方法(前提是在自己的对象域中，当然如果两个对象在同一个作用域中，就不用那么麻烦了，但是每一个网页都是一个对象，在本对象内部作用域去访问另一个对象，就需要有到公共的方法，并且两个对象都可以接受到的。就是在后台才会有的request和response等方法)。

所以本节讨论的：主要是在窗体自己作用域内父子页面传值，有两点

  1. iframe是html中的一个标签，也就是window对象的一个成员(尽管它是网页)，对象与成员之间的信息传递是简单的
  2. js脚本window.open(网页路径)，就是window对象new了一个window对象，open实际也是window对象的成员，但是它与iframe不同的是它是一个匿名对象。

页面传值方法：

1. iframe

子页面获取父页面对象方法：window.parent

父页面获取子页面对象方法：window.frames[iframe对象的name值]

2. window.open()

子页面获取父页面对象方法： window.opener

参考页面：http://www.jb51.net/article/25629.htm

代码参考：

1.父页面代码(father.html)

 <!DOCTYPE html>

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

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

     <script src="../js/jquery-1.10.2.js"></script>

     <title></title>

     <script type="text/javascript">

         function sayOpen()

         {

             alert("I am father(设置或获取创建当前窗口的窗口的引用)");

         }

         function sayFrame() {

             alert("I am father(获取对象层次中的父窗口)");

         }

         function getIframe()

         {

             window.frames["one"].showSon();

             window.frames["two"].showIframe();

         }

     </script>

 </head>

 <body>

     该页面是被创建的页面：<a href="#" onclick="window.open('son.html')">创建子页</a><br />

     <br />

     <input type="button" onclick="getIframe()" value="获取子页" />

     <br />

     <iframe name="one" frameborder="0" src="son.html">

     </iframe>

     <iframe name="two" frameborder="0" src="iframe_one.html">

     </iframe>

 </body>

 </html>

2.子页面代码

(son.html和iframe_one.html)

 <!DOCTYPE html>

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

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

     <title></title>

     <script type="text/javascript">

         function showSon() {

             alert("I am son");

         }

     </script>

 </head>

 <body>

     <input type="button" onclick="window.opener.sayOpen()" value="创建页单击事件" /><br />

     <input type="button" onclick="window.parent.sayFrame()" value="Iframe页单击事件" /><br />

 </body>

 </html>
 <!DOCTYPE html>

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

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

     <title></title>

     <script type="text/javascript">

         function showIframe() {

             alert("I am iframe");

         }

     </script>

 </head>

 <body>

     我是子页iframe

 </body>

 </html>

iframe标签常用设置：

<iframe height="300px" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no" allowtransparency="yes" src="../../../EFM/Model.aspx" style="overflow-x:visible;overflow-y:visible"></iframe>

js控制父子页面传值（iframe和window.open）的更多相关文章

  1. 【js】【图片显示】js控制html页面显示图片方式

    js控制html页面显示图片方式,只需要引入“jquery-1.11.2.min.js” js: /* 引用 <script src="jquery-1.11.2.min.js&quo ...

  2. iframe 自适应高度、父子页面传值、回调

    总结一下最近用iframe遇到的问题与解决办法: 结构:主页面main.html,里面套用iframe.iframe不能出现滚动条,自适应子页面高度.内容多了滚动条是main.html页面的. 1.  ...

  3. JS原生父子页面操作

    var api = frameElement.api;  //当前 W = api.opener;//父页面 W.setPerSel(jsonStr); api.close(); //关闭窗口 js操 ...

  4. C#--父子页面传值、刷新（showModalDialog）

    父页面: var obj = new Object(); obj.name="name"; var rtnValue=window.showModalDialog("ch ...

  5. 父子页面（iframe）相互获取对方dom元素

    现在iframe的使用虽然开始越来越少,但是还是有牵涉到iframe的使用情况,特别是多个iframe互相嵌套,又要进行获取的情况. 现在整理了父子iframe之间互相获取的方式. (1)父页面获取子 ...

  6. js 控制框架页面跳转 top.location.herf = "url"

    top.location.href和localtion.href有什么不同 top.location.href=”url”          在顶层页面打开url(跳出框架) self.locatio ...

  7. JS控制静态页面之间传递参数获取参数并应用

    在项目中遇到这也一个问题: 有a.html和b.html. 1.a页面已经打开,b页面尚未打开,我希望在a页面设置好一些列参数,比如背景色,宽度等参数,传递给b页面,好让b页面在打开就能应用. 2.a ...

  8. JS 控制子页面刷新父页面

    iframe里面的子页,用parent.location.href = parent.location.reload();如果是window.open 打开就用opener.location.relo ...

  9. mui 进行父子页面传值以及接收

    1.在父级页面进行传值 (my) mui.openWindow({ url: 'a.html', id: 'a', extras: { my: 'listpub' },}); 2.自己页面接收值 mu ...

随机推荐

  1. android小知识之EditText输入框之值监控以及类型限制（数字，英语字母，下划线，是否为星号密码）

    1.设置EditText的值监听事件 . <span style="font-size:14px;color:#990000;"> EditText ed=new Ed ...

  2. qcow2、raw、vmdk等镜像格式

    转自 http://www.prajnagarden.com/?p=248 http://blog.csdn.net/starshine/article/details/8179483 转者言:对pr ...

  3. RedisTemplate.htm

    http://docs.spring.io/spring-data/redis/docs/current/api/org/springframework/data/redis/core/RedisTe ...

  4. Noip2013错误避免

    很多的时候,我们会说,这道题我会做,算法想出来了,但是这里那里少了一些判断,导致一分未得,或是说变量名错误,或者说干脆是文件名错误.这些都不是理由,如果火箭发射半空爆炸,可以说是控制器中一个运算符错误 ...

  5. [cpp]伯乐在线编程挑战第 0 期 – 呼叫转移系统

    题目: 描述 呼叫转移服务是一个把呼叫号码A转移到号码B的服务.举个例子:当你正在度假时,这样的系统非常有帮助.A君度假去了,那么,A君的工作电话可以通 过呼叫转移至B君.更进一步讲,当B君也正好在度 ...

  6. DICOM医学图像处理：DCMTK在VS2012中的配置

    背景: 近期因为项目须要,将原本的开发IDE环境由VS2008升级到了VS2012.本以为编译完毕后的DCMTK开源库能够直接从VS2008移植到VS2012.可是通过项目属性加入完包括文件夹和依赖库 ...

  7. java思考题

    1.仔细阅读示例: EnumTest.java,运行它,分析运行结果? 你能得到什么结论?你掌握了枚举类型的基本用法了吗? public class EnumTest { public static ...

  8. BZOJ 3444: 最后的晚餐( )

    把暗恋关系看成无向边, 那某个点度数超过2就无解.存在环也是无解.有解的话对连通分量进行排列就行了. ------------------------------------------------- ...

  9. 关于tomcat的clean

    1 添加了一个web项目到tomcat,然后进行clean的时候,根目录实际上是在WebContent下,也就是说存放在WebContent目录下的所有文件在clean的时候才会被添加到tomcat对 ...

  10. [LeetCode]题解（python）：096-Unique Binary Search Trees

    题目来源: https://leetcode.com/problems/unique-binary-search-trees/ 题意分析: 给定一个整数n,返回所有中序遍历是1到n的树的可能. 题目思 ...