javascript调用父窗口(父页面)的方法
1: window.parent 是iframe页面调用父页面对象
举例:
a.html
- <html>
- <head><title>父页面</title></head>
- <body>
- <form name="form1" id="form1">
- <input type="text" name="username" id="username"/>
- </form>
- <iframe src="b.html" width=100%></iframe>
- </body>
- </html>
如果我们需要在b.htm中要对a.htm中的username文本框赋值,就如很多上传功能,上传功能页在Ifrmae中,上传成功后把上传后的路径放入父页面的文本框中
我们应该在b.html中写
- <script type="text/javascript">
- var _parentWin = window.parent ;
- _parentWin.form1.username.value = "xxxx" ;
- </script>
实例地址: http://www.cnspry.cn/blog/attachments/window.parent 实例/a.html
源码:
1.a.html
- <html>
- <head>
- <title>主页面</title>
- <script>
- /** 为测试IFrame子窗口调用父窗口的全局变量而添加的测试变量 */
- var parentVairous = "为测试IFrame子窗口调用父窗口的全局变量而添加的测试变量";
- function parentInvokeIFrame()
- {
- var iframeTest = document.frames["iframeTest"]; //使用document.getElementById("iframeTest");同样可以
- alert(iframeTest.document.body.innerHTML);
- alert(iframeTest.iFrameVair);
- }
- </script>
- </head>
- <body>
- <form name="form1" id="form1">
- <input type="text" name="username" id="username"/>
- <input type = "button" value = "父窗口调用IFrame子窗口中的内容" onclick = 'parentInvokeIFrame()'/>
- </form>
- <iframe src="b.html" width = '100%' id = 'iframeTest'></iframe>
- </body>
- </html>
1.b.html
- <html>
- <head>
- <title></title>
- <script type="text/javascript">
- /** 为测试父窗体调用IFrame子窗体的全局函数而添加的子窗口全局函数 */
- var iFrameVair = "测试父窗体调用IFrame子窗体的全局函数";
- function UpdateParent()
- {
- var _parentWin = window.parent ;
- _parentWin.form1.username.value = "xxxx" ;
- }
- function childInvokeParent()
- {
- var parentVairous = window.parent.window.parentVairous;
- alert(parentVairous);
- }
- </script>
- </head>
- <body>
- <form name="form1" id="form1">
- <p> </p>
- <p align="center">
- <input type = "button"
- name = "button"
- id = "button"
- value = "更新主页面的UserName内容"
- onclick = "UpdateParent()">
- <input type = "button"
- name = "button2"
- id = "button2"
- value = "测试IFrame子窗口调用父窗口的全局变量"
- onclick = "childInvokeParent();"/>
- </p>
- <p> </p>
- </form>
- </body>
- </html>
2: window.opener 是window.open 打开的子页面调用父页面对象
实例地址: http://www.cnspry.cn/blog/attachments/window.opener 实例/a.html
源码:
2.a.html
- <html>
- <head>
- <title>主页面</title>
- <script type="text/javascript">
- /** 为测试IFrame子窗口调用父窗口的全局变量而添加的测试变量 */
- var parentVairous = "为测试IFrame子窗口调用父窗口的全局变量而添加的测试变量";
- /**
- * 因为不同于IFrame(IFrame有id,window.open()与IFrame的父子窗口的模式不同),
- * 所以当是通过window.open()方法打开一个新窗口使, 必须有一个新窗口的对象
- * 当然必须先让子窗口弹出来, 才能调用子窗口中的变量, 否则抛出异常
- */
- var OpenWindow;
- function openSubWin()
- {
- OpenWindow = window.open('b.html', 'newwindow', 'height=1024, width=1300, top=0, left=0, toolbar=no, menubar=yes, scrollbars=yes,resizable=yes,location=no, status=no');
- }
- function parentInvokeChild()
- {
- if(OpenWindow)//当然必须先让子窗口弹出来, 才能调用子窗口中的变量, 否则抛出异常
- {
- alert(OpenWindow.iFrameVair);
- }
- }
- </script>
- </head>
- <body>
- <form name="form1" id="form1">
- <input type="text" name="username" id="username"/>
- <input type="button" value="弹出子页面" onclick = "openSubWin()">
- <input type="button" value="测试调用弹出窗口中的全局变量" onclick = "parentInvokeChild()">
- </form>
- </body>
- </html>
2.b.html
- <html>
- <head>
- <title>子页面</title>
- <script type="text/javascript">
- /** 为测试父窗体调用IFrame子窗体的全局函数而添加的子窗口全局函数 */
- var iFrameVair = "测试父窗体调用IFrame子窗体的全局函数";
- function UpdateParent()
- {
- var _parentWin = window.opener;
- _parentWin.form1.username.value = "xxxx" ;
- }
- function childInvokeParent()
- {
- var parentVairous = window.opener.window.parentVairous;
- alert(parentVairous);
- }
- </script>
- </head>
- <body>
- <form name="form1" id="form1">
- <p> </p>
- <p align="center">
- <input type="button"
- onclick = "UpdateParent();"
- name="button"
- id="button"
- value="更新主页面的UserName内容">
- <input type = "button"
- name = "button2"
- id = "button2"
- value = "测试IFrame子窗口调用父窗口的全局变量"
- onclick = "childInvokeParent();"/>
- </p>
- <p> </p>
- </form>
- </body>
例如修改:OpenWindow = window.open('b.html', 'newwindow', 'height=1024, width=1300, top=0, left=0, toolbar=no, menubar=yes, scrollbars=yes,resizable=yes,location=no, status=no');
为:OpenWindow = window.showModalDialog("b.html",'newwindow',"dialogHeight:100px,center:yes,resizable:no,status:no");
在子窗口中当希望修改父窗口中的内容时,会弹出“某某”为空或不是对象的错误,而这里的“某某”就是你想修改的父窗口中的内容
javascript调用父窗口(父页面)的方法相关推荐
- 使用JS/Jquery获得父窗口的几个方法(笔记)
<pre name="code" class="javascript">取父窗口的元素方法:$(selector, window.parent.do ...
- Vue.js如何在一个页面调用另一个同级页面的方法
实际开发过程中,当前组件调用完方法之后,也许会调取同一级组件中的方法,本人暂时想到两种办法: 1. vm.$on(event,callback) 新建一个工具函数util.js,代码如下: impor ...
- window.open window.showModelDialog 打开一个新窗口/子窗口中调用父窗口的方法
window.open 只打开一个窗口是将 oNewWindow = window . open ( sURL , sName , sFeatures , ...
- java弹框刷新原页面_JavaScript:关闭弹出窗口时刷新父窗口
说明: 关闭弹出窗口时刷新父窗口也可以说是关闭子窗口时自动刷新父窗口中的信息,即用户通过window对象的open()方法打开一个新窗口(子窗口),当用 户在该子窗口中进行了数据库操作(如数据添加.修 ...
- qtabwidget放大_Qt自定义弹窗屏蔽父窗口(QWidget设置setWindowModality(Qt::ApplicationModal);以后再show)...
写Qt程序时遇到一个问题: Qt自带的弹窗功能单一,所以须要自己用ui设计弹窗的内容,这样弹窗就和普通窗口一样了,但问题是这个弹窗显示后父窗口还是活动的.网上找了很久找到了解决办法: Qt::Wind ...
- layer.open参数;layer.open关闭事件;layer.open关闭刷新;layer.open获取子页的值;layer.open调用子页面的方法
父页面 function layerOpen(){layer.open({type: 2,shade: [0],title: "验收申请",area: ['1024px', '68 ...
- javascript调用Flash里对象的方法(函数)搞了五个小时。
搞了几个小时后,才发现,之前走的路是错的. 今天在Firefox浏览器上测试一个javascript调用Flash中的一个对象的方法时遇到问题了, 一搞就整整搞了一个下午. 我记得之前我用Flash8 ...
- QT 在子窗口中调用主窗口的UI
在QT中,我们时常会需要在主窗口里添加一些子窗口,比如添加一个新的对话框,或者在TabWidget中添加tab页面.通常添加子窗口后,如果在子窗口中做了一些操作,我们需要在主窗口中通过UI控件反映出来 ...
- 一个html多个html文件怎么打开网页,Firefox如何单窗口多页面浏览
Firefox单窗口多页面浏览方法. ①按下" Ctrl + 鼠标左键"点击链接. ②使用鼠标中鍵点击链接. 简介 火狐浏览器(Mozilla Firefox)是由Mozilla开 ...
最新文章
- android地图定位
- 防护很重要!教你教你认识和检验安防产品的IP防护等级
- 姚班学霸蝉联第一,清华再霸榜,湘潭大学表现亮眼,第四届 CCF CCSP落下帷幕...
- 用到的oracle sql语句-001
- CSS行内元素和块级元素的水平居中,垂直居中,水平垂直居中实现
- python线程创建对象_python 多线程(一)
- Scala 获取当前时间
- tshark/wireshark抓包小结
- mac系统安装python(2.7)requests库
- python连接数据库--查询数据
- Spring 多线程下注入 bean 问题详解
- vscode使用svn插件
- Vue3.0中文文档(Vue3 + TS学习资源路线)
- ubuntu安装的微信不能发送图片
- html 组合快捷键,ctrl常用组合键有哪些
- 零基础使用Xmind
- 一条Fofa搜索语法,实现批量挖洞
- java8中的Stream流式操作总结,List转Map或List转LinkedHashMap使用Collectors.groupingBy用法
- 建木(Jianmu)----迈出建木第一步创建项目分组
- 互联网快讯:永辉拟打造数字化零售;猿辅导,掌门教育积极布局素质教育