在父窗口中获取iframe中的元素

1、

格式：window.frames["iframe的name值"].document.getElementByIdx_x("iframe中控件的ID").click();

实例：window.frames["ifm"].document.getElementByIdx_x("btnOk").click();

2、

格式：

var obj=document.getElementByIdx_x("iframe的name").contentWindow;

var ifmObj=obj.document.getElementByIdx_x("iframe中控件的ID");

ifmObj.click();

实例：

var obj=document.getElementByIdx_x("ifm").contentWindow;

var ifmObj=obj.document.getElementByIdx_x("btnOk");

ifmObj.click();

在iframe中获取父窗口的元素

格式：window.parent.document.getElementByIdx_x("父窗口的元素ID").click();

实例：window.parent.document.getElementByIdx_x("btnOk").click();

jquery

在父窗口中获取iframe中的元素

1、

格式：$("#iframe的ID").contents().find("#iframe中的控件ID").click();//jquery 方法1

实例：$("#ifm").contents().find("#btnOk").click();//jquery 方法1

2、

格式：$("#iframe中的控件ID",document.frames("frame的name").document).click();//jquery 方法2

实例：$("#btnOk",document.frames("ifm").document).click();//jquery 方法2

在iframe中获取父窗口的元素

格式：$('#父窗口中的元素ID', parent.document).click();

实例：$('#btnOk', parent.document).click();

父窗获取子窗口的IFrame中的JS方法
一、父窗口调用iframe子窗口方法 
1、HTML语法：<iframe name="myFrame" src="child.html"></iframe> 
2、父窗口调用子窗口：myFrame.window.functionName(); 
3、子窗品调用父窗口：parent.functionName(); 
简单地说,也就是在子窗口中调用的变量或函数前加个parent.就行 
4、父窗口页面源码： 
复制代码代码如下:

<html> 
<head> 
<script type="text/javascript"> 
function say() { 
alert("parent.html------>I'm at parent.html"); 
} 
function callChild() 
{ 
//document.frames("myFrame").f1(); 
myFrame.window.say(); 
} 
</script> 
</head> 
<body> 
<input type=button value="调用child.html中的函数say()" onclick="callChild()"> 
<iframe name="myFrame" src="child.html"></iframe> 
</body> 
</html>

5、子窗口页面： 
复制代码代码如下:

<html> 
<head> 
<script type="text/javascript"> 
function say() 
{ 
alert("child.html--->I'm at child.html"); 
} 
function callParent() { 
parent.say(); 
} 
</script> 
</head> 
<body> 
<input type=button value="调用parent.html中的say()函数" onclick="callParent()"> 
</body> 
</html>

二、iframe 父窗口和子窗口相互的调用方法 
1、IE中使用方法： 
父窗口调用子窗口：iframe_ID.iframe_document_object.object_attribute = attribute_value 
例子：onClick="iframe_text.myH1.innerText='http://www.pint.com';" 
子窗口调用父窗口：parent.parent_document_object.object_attribute = attribute_value 
例子：onclick="parent.myH1.innerText='http://www.pint.com';" 
2、Firefox中使用方法： 
上面在IE下没有问题，但在firefox下不正常。在firefox下，应该是如下调用方法： 
父窗口调用子窗口：window.frames["iframe_ID"].document.getElementById("iframe_document_object"­).object_attribute = attribute_value 
例： window.frames["iframe_text"].document.getElementById("myH1").innerHTML= "http://hi.jb51.net"; 
子窗口调用父窗口：parent.document.getElementById("parent_document_object").object_attribute = attribute_value 
例： parent.document.getElementById("myH1").innerHTML = "http://jb51.net"; 
3、完整的例子 
test.htm 
复制代码代码如下:

<HTML> 
<HEAD> 
<TITLE> Test Page </TITLE> 
<script src="prototype-1.4.0.js"></script> 
<script language="javascript"> 
function show() 
{ 
window.frames["iframe_text"].document.getElementById("myH1").innerHTML = "http://hi.jb51.net"; 
} 
</script> 
</HEAD> 
<BODY> 
<iframe height="350" width="600" src="iframe_test.htm" name="iframe_text"></iframe> 
<form action="" method="post"> 
<input name="haha" id="haha" type="text" maxlength="30" value="haha" /> 
<br /> 
<textarea cols="50" rows="5" id="getAttributeMethod"></textarea> 
<input type="button" onClick="show();" value="提交"/> 
</form> 
<h1 id="myH1">d</h1> 
</BODY> 
</HTML>

frame_test.htm 
复制代码代码如下:

<!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> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>无标题文档</title> 
</head> 
<script language="javascript"> 
function show() 
{ 
parent.document.getElementById("myH1").innerHTML = http://jb51.net; 
} 
</script> 
<body> 
<h1 id="myH1">ha</h1> 
<form action="" method="post"> 
<input name="abc" id="abc" type="text" maxlength="30" value="abc" /> 
<br /> 
<textarea cols="50" rows="10" id="text"></textarea> 
<br /> 
<input type="button" value="提交" onclick="show();"/> 
</form> 
</body> 
</html>

test.htm里面firefox下访问iframe 必须用name，不能用id，所以要改为name="iframe_test" 。
三、在c#中如何动态改变iframe的src值，动态指向一个网页 
1)如果是javascript脚本 
给iframe加一个ID如<iframe id=frmList…… 
在脚本写 
frmList.document.location=strNewUrl 
2)如果是后台程序 
给iframe加一个ID，再加上runat=server 如<iframe id=frmList runat=server …… 
在程序里写 
frmList.Attributes.Add("src",strNewUrl);

父窗口 和 iframe 互相访问的更多相关文章

  1. 父窗口调用iframe子窗口方法

    一.父窗口调用iframe子窗口方法 1.HTML语法:<iframe name="myFrame" src="child.html"></i ...

  2. 父窗口与iFrame之间调用方法和元素

    父窗口与iFrame之间调用方法和元素 父窗口调用子窗口: 调用元素 js格式: var obj=document.getElementById("iframe的name").co ...

  3. 父窗口和iframe子窗口之间相互传递参数和调用函数或方法

    1.父窗口向子窗口传递参数: 可以在url中添加参数:2.html?a=1&b=2&c=3 然后在子页面上可用js解析,提供一个函数: function getQueryStr(sAr ...

  4. iframe中子父窗口互调的js方法

    转载自:http://www.cnblogs.com/chinafine/archive/2011/09/15/2177746.html 一.父窗口调用iframe子窗口方法 1.HTML语法:< ...

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

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

  6. iframe 和 父窗口传递

    iframe 向父窗口 window.parent.postMessage('向父窗口传递值',*); 父窗口向 iframe 内部子窗口传值 documnet.querySelector('ifra ...

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

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

  8. Js的iframe相关问题，如何判断当前是否在iframe中，iframe和它的父窗口如何通信

    一.前言: 在web中,为了丰富我们的内容,往往需要引用其它HTML文件,这时候就需要用到 iframe 标签,本文就主要记录一下使用iframe所需要注意的问题 iframe 所使用的环境(笔者所遇 ...

  9. 动态新增删除tbody表格行与ajax请求完成后刷新父窗口问题

    获取tbody内的一行数据,包括hidden类型的数据$("#tbody_id").find("tr").each(function(){ var tdArr ...

随机推荐

  1. 下拉刷新XListView的简单分析

    依照这篇博文里的思路分析和理解的 先要理解Scroller,看过的博文: http://ipjmc.iteye.com/blog/1615828 http://blog.csdn.net/wangji ...

  2. Java初学者不可不知的MyEclipse的设置技巧（自动联想功能）

    最近初学Java,正在使用MyEclipse来编写新的项目,刚开始打开MyEclipse感觉这个工具既陌生又熟悉,熟悉之处在于编辑器的几大共通之处它都具备,比如说基本的设置.编辑区.调试区都是类似的, ...

  3. Objective-C语法之指针型参数

    main.m #import <Foundation/Foundation.h> /** * 测试指针型参数和普通参数的区别 * * @param a 指针型参数 * @param b 普 ...

  4. Android布局学习——android:gravity和android:layout_gravity的区别

    [Android布局学习系列]   1.Android 布局学习之——Layout(布局)详解一   2.Android 布局学习之——Layout(布局)详解二(常见布局和布局参数)   3.And ...

  5. 远程执行命令和文件分发shell脚本

    deploy.conf node01,all,other,datanode,journalnode,zookeeper, node02,all,other,datanode,journalnode,z ...

  6. C#文件操作工具类

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.I ...

  7. Mongodb安全认证

    Mongodb安全认证在单实例和副本集两种情况下不太一样,单实例相对简单,只要在启动时加上 --auth参数即可,但副本集则需要keyfile. 一.单实例 1.启动服务(先不要加auth参数) 2. ...

  8. mysql 日志操作

    https://www.cnblogs.com/dreamworlds/p/5478293.html http://www.jb51.net/article/76886.htm

  9. HTML5标签canvas制作平面图

    摘要: HTML5规范已经完成了,互联网上已经有数不清的站点使用了HTML5.从现在开始研究HTML5,本文是自己在学习canvas过程中的记录,以备后需. 历史: 这个 HTML 元素是为了客户端矢 ...

  10. ajax简单手写了一个猜拳游戏

    使用ajax简单写一个猜拳游戏 HTML代码 <!DOCTYPE HTML> <html lang="en-US"> <head> <me ...