iframe的父子窗口之间的对象相互调用基本用法

使用iframe的时候，可能会涉及到父子窗口之间传值和方法的相互调用，之前一直有些迷糊，也没有着意去弄清楚，这两天要干活，没法子了只好把这都弄明白了。其实非常简单，就那么几个用法，几句代码而已。

子窗口中调用父窗口的js方法：


代码如下:

parent.changeBtnTitle('tzgg');

一个父窗口中可能会有若干个功能行为类似的子窗口，子窗口中的组件要调用相同或者类似的对象或者方法，那么就把这样的方法写在父窗口中，通过传递参数来达到不同的效果。

父窗口获得子窗口中的某个对象：

首先要获得子窗口的iframe对象，比如：


代码如下:

var frameName = window.frames["frameId"]

然后要获得该子窗口的document值，然后就可以调用子窗口中的对象了。在父窗口中使用时为避免反复书写，不妨写成一个方法：


代码如下:

getSubWindowObj = function(moduleName){
return window.frames["iframe"+moduleName].document.getElementById("moreorless"+moduleName);
}

这里只用了一个参数，只因为我的iframeId和子窗口的对象Id名字起的有规律，只需传入一个参数拼接之后就可以饿了。

同样，子页面调用父页面的元素，可以使用如下代码：


代码如下:

parent.window.document.getElementById('parentMenu');
//简写
parent.document.getElementById('parentMenu');

赞 (0)

相关推荐

  • iframe的父子窗口之间的对象相互调用基本用法

    使用iframe的时候,可能会涉及到父子窗口之间传值和方法的相互调用,之前一直有些迷糊,也没有着意去弄清楚,这两天要干活,没法子了只好把这都弄明白了.其实非常简单,就那么几个用法,几句代码而已. 子窗口中调用父窗口的js方法: 复制代码 代码如下: parent.changeBtnTitle('tzgg'); 一个父窗口中可能会有若干个功能行为类似的子窗口,子窗口中的组件要调用相同或者类似的对象或者方法,那么就把这样的方法写在父窗口中,通过传递参数来达到不同的效果. 父窗口获得子窗口中的某个对象

  • 详解layui弹窗父子窗口之间传参数的方法

    本文介绍了layui弹窗父子窗口之间传参数的方法,分享给大家,具体如下: 1.父页面打开子页面并向子页面传参数 function setChooseValues(ret){ var oView = document.getElementById("userName"); var oValue = document.getElementById("userIds"); var i = 0; if( ret != null){ oValue.value="&q

  • jQuery实现iframe父窗体和子窗体的相互调用

    本文实例讲述了jQuery实现iframe父窗体和子窗体的相互调用方法.分享给大家供大家参考,具体如下: 父窗体 <html> <head> <title>usually function</title> </head> <body> <iframe src="http://www.baidu.com" ></iframe> <iframe src="myifame.html

  • ThinkPHP控制器间实现相互调用的方法

    本文实例讲述了ThinkPHP控制器间实现相互调用的方法.分享给大家供大家参考.具体实现方法如下: ThinkPHP同一个项目里,两个控制器的方法如何相互调用呢?ThinkPHP提供了一个A(),通过它可以使控制器之间的方法相互调用,使得代码可以重复利用. 官方似乎对A()方法没有相关使用文档,现在通过一个例子来说一下如使用A()方法. 有两个控制器,ColumnsAction和NewsAction.ncatlist()是ColumnsAction的分类列表方法,现在我要在控制器NewsActi

  • 关于Iframe父页面与子页面之间的相互调用

    iframe元素就是文档中的文档. window对象: 浏览器会在其打开一个HTML文档时创建一个对应的window对象.但是,如果一个文档定义了一个或者多个框架(即:包含一个或者多个frame或者iframe标签),浏览器就会为原始文档创建一个window对象,再为每个iframe创建额外的window对象,这些额外的window对象是原始窗口的子窗口. contentWindow: 是指指定的iframe或者iframe所在的window对象 Demo1 父页面fu.html: <!DOCT

  • pyqt 多窗口之间的相互调用方法

    * 在编程开发中,一个程序不可避免的需要多窗口操作来实现具体的功能. 实现此功能的基本步骤(以三个窗口为例,使用主窗口调用其它两个窗口) # 主窗口 from PyQt5 import QtCore, QtGui, QtWidgets class Ui_MainWindow(object): def setupUi(self, MainWindow): MainWindow.setObjectName("MainWindow") MainWindow.resize(800, 600)

  • JS简单实现父子窗口传值功能示例【未使用iframe框架】

    本文实例讲述了JS简单实现父子窗口传值功能.分享给大家供大家参考,具体如下: 父窗口页面father.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE>父窗口 </TITLE> <script language="javascript"> <!-- functio

  • layer弹出层父子页面事件相互调用方法

    // 父页面 <body> <a data-url="bbbb.html" id="parentIframe">小小提示层</a> <input id="shuzhi" /> <button class="but_par">父页面</button> </body> <script src="../jquery-1.9.1.min

  • 详解从Node.js的child_process模块来学习父子进程之间的通信

    child_process模块提供了和popen(3)一样的方式来产生自进程,这个功能主要是通过child_process.spawn函数来提供的: const spawn = require('child_process').spawn; const ls = spawn('ls', ['-lh', '/usr']); ls.stdout.on('data', (data) => { console.log(`stdout: ${data}`); }); ls.stderr.on('data'

  • iframe中子父类窗口调用JS的方法及注意事项

    一.前言 我页面用的是EasyUI的弹出窗口里面嵌入一个iframe. 第一:父窗口打开子窗口是一个新增用户信息的iframe子页面,点击保存后,子窗口iframe则去调用父窗口的function closeAddWindow()方法,让父窗口去关闭新增页面: 第二:父窗口打开一个设置用户权限的iframe子窗口,首先打开这个子窗口会全部加载数据库表中所有的存在的权限,然后子窗口需要把加载的权限信息拼接html  Append到一个ID为<table id="tb"><

随机推荐