在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. grunt api 文档

    Grunt docs Grunt和 Grunt 插件是通过 npm 安装并管理的,npm是 Node.js 的包管理器. 安装 grunt-cli npm install grunt-cli -g 注 ...

  2. PADS LAYOUT到底怎么走线

    PADS LAYOUT走线,是不是转角要自己手动慢慢转角啊?不能像PROTEL中那样自动转角吗 自己手动转角老是转不好,出现许多线头,对不齐,是不是我操作有误啊 走线的过程中,可以试试这个,切换端点. ...

  3. 在PADS LAYOUT中修改所有元件字体的大小,怎么修改?

    1.选中一个字符,Ctrl+Q查看一下属性,是在哪一层. 2.Ctrl+Alt+F(Filter)打开滤波器选项,点Layer,将除字符所在层之外的层全部关掉,即将其前面的"√"去 ...

  4. C++中类成员函数作为回调函数

    注:与tr1::function对象结合使用,能获得更好的效果,详情见http://blog.csdn.net/this_capslock/article/details/38564719 回调函数是 ...

  5. SPOJ 1812 Longest Common Substring II(后缀自动机)

    [题目链接] http://www.spoj.com/problems/LCS2/ [题目大意] 求n个串的最长公共子串 [题解] 对一个串建立后缀自动机,剩余的串在上面跑,保存匹配每个状态的最小值, ...

  6. 【转载】Android Studio jar、so、library项目依赖,原文链接http://zhengxiaopeng.com/2014/12/13/Android-Studio-jar、so、library项目依赖/

    前言 Android Studio(以下简称AS)在13年I/O大会后放出预览版到现在放出的正式版1.0(PS.今天又更新到1.0.1了)历时一年多了,虽然Google官方推出的Android开发者的 ...

  7. java单链表代码实现

    用惯了C++,java写起来果然不太爽...不废话了,上代码... package javaInnerclassDemo; class Link{ class Node{ private String ...

  8. 【HDU】病毒侵袭持续中(AC自己主动机+map)

    一開始一直WA,之后发现这道题不止一组输入,改成多组输入之后就过了. 利用map把每一个字符串映射到它相应的结点上即可了. 11909467 2014-10-19 11:54:00 Accepted ...

  9. superMap Object 属性查看的一点代码

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  10. Foundation 框架 NSFileManager,NSData 简单的文件操作

    一.简单展示NSFileManager的使用 #import <Foundation/Foundation.h> int main(int argc, const char * argv[ ...