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()" οnclick="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()函数" οnclick="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 
例子:οnclick="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="提交" οnclick="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); 

转载于:https://www.cnblogs.com/examine/p/4913207.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/458726.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

yii2 ajax分页,Yii框架分页技术实例分析

本文实例讲述了Yii框架分页技术。分享给大家供大家参考&#xff0c;具体如下&#xff1a;直接上代码&#xff1a;1.首先写控制器层先引用pagination类use yii\data\Pagination;写自己的方法:function actionFenye(){$data Field::find(); //Field为model层,在控制器刚开始use了…

Spring源码解析——如何阅读源码

阅读目录 下面看一下如何使用jar包以及源码的source包  下面给出一个简单的spring样例  如何阅读源码最近没什么实质性的工作&#xff0c;正好有点时间&#xff0c;就想学学别人的代码。也看过一点源码&#xff0c;算是有了点阅读的经验&#xff0c;于是下定决心看下spring…

c++多线程编程

一直对多线程编程这一块很陌生&#xff0c;决定花一点时间整理一下。 os:ubuntu 10.04 c 1.最基础&#xff0c;进程同时创建5个线程&#xff0c;各自调用同一个函数 [html] view plaincopy #include <iostream> #include <pthread.h> //多线程相关操作头文件&am…

ajax当页post请求,tag落地页--通过ajax-post请求数据

查询所有tag及其对应跳转链接$tags get_tags(array(get>all));$output . ;if($tags) {foreach ($tags as $tag):$output . . $tag->name .;endforeach;} else {_e(No tags created., text-domain);}$output . ;echo $output;交互tag查询image场景如下&#xff0c;通过页…

GIT的PUSH指令

### GIT的PUSH指令 $ git push <远程主机名> <本地分支名>:<远程分支名> * git push命令用于将本地分支的更新&#xff0c;推送到远程主机。 * 如果省略远程分支名&#xff0c;则表示将本地分支推送到与之对应的远程分支&#xff08;通常两者同名&#xff…

Android 编程下 Touch 事件的分发和消费机制

Android 中与 Touch 事件相关的方法包括&#xff1a;dispatchTouchEvent(MotionEvent ev)、onInterceptTouchEvent(MotionEvent ev)、onTouchEvent(MotionEvent ev)&#xff1b;能够响应这些方法的控件包括&#xff1a;ViewGroup、View、Activity。方法与控件的对应关系如下表所…

ios微信本地视频上传到服务器,ios本地视频wx.uploadFile上传

//上传视频uploadVideo:function(){let _this this;let list [camera, album];wx.showActionSheet({itemList: [拍摄视频,从相册选择视频,从视频库选择视频],success: function (res) {if(res.tapIndex0 || res.tapIndex1){wx.chooseVideo({sourceType:[list[res.tapIndex]],…

如何手工抓取dump文件及分析

在生产环境下进行故障诊断时&#xff0c;为了不终止正在运行的服务或应用程序&#xff0c;有两种方式可以对正在运行的服务或应用程序的进程进行分析和调试。 首先一种比较直观简洁的方式就是用WinDbg等调试器直接attach到需要调试的进程&#xff0c;调试完毕之后再detach即可。…

Java 类加载机制详解

2019独角兽企业重金招聘Python工程师标准>>> 一、类加载器 类加载器&#xff08;ClassLoader&#xff09;&#xff0c;顾名思义&#xff0c;即加载类的东西。在我们使用一个类之前&#xff0c;JVM需要先将该类的字节码文件&#xff08;.class文件&#xff09;从磁盘…

JAVA vo pojo javabean dto区别

JavaBean 是一种JAVA语言写成的可重用组件。为写成JavaBean&#xff0c;类必须是具体的和公共的&#xff0c;并且具有无参数的构造器。JavaBean 通过提供符合一致性设计模式的公共方法将内部域暴露成员属性。众所周知&#xff0c;属性名称符合这种模式&#xff0c;其他Java 类可…

编写的windows程序,崩溃时产生crash dump文件的办法

一、引言 dump文件是C程序发生异常时&#xff0c;保存当时程序运行状态的文件&#xff0c;是调试异常程序重要的方法&#xff0c;所以程序崩溃时&#xff0c;除了日志文件&#xff0c;dump文件便成了我们查找错误的最后一根救命的稻草。windows程序产生dump文件和linux程序产生…

Nginx+PHP实时生成不同尺寸图片

原来图片服务器采用Windows .net架构&#xff0c;鉴于需求需要生成各种尺寸图片。流程说明:用户从Nginx请求对应的图片,判断是否存在_200x300的对应参数&#xff0c;如果没有就直接请求到对应目录的原图&#xff0c;否则继续判断是否在本地已经生成了对应的缓存图片&#xff0c…

JavaScript设计模式 Item 2 -- 接口的实现

1、接口概述 1。什么是接口&#xff1f; 接口是提供了一种用以说明一个对象应该具有哪些方法的手段。尽管它可以表明这些方法的语义&#xff0c;但它并不规定这些方法应该如何实现。 2. 接口之利 促进代码的重用。 接口可以告诉程序员一个类实现了哪些方法&#xff0c;从而帮助…

Spring Boot 乐观锁加锁失败 - 集成AOP

Spring Boot with AOP 手头上的项目使用了Spring Boot&#xff0c; 在高并发的情况下&#xff0c;经常出现乐观锁加锁失败的情况&#xff08;OptimisticLockingFailureException&#xff0c;同一时间有多个线程在更新同一条数据&#xff09;。为了减少直接向服务使用者直接返回…

掌握VS2010调试 -- 入门指南

1 导言 在软件开发周期中&#xff0c;测试和修正缺陷&#xff08;defect&#xff0c;defect与bug的区别&#xff1a;Bug是缺陷的一种表现形式&#xff0c;而一个缺陷是可以引起多种Bug的&#xff09;的时间远多于写代码的时间。通常&#xff0c;debug是指发现缺陷并改正的过程。…

151031

create or replace procedure pr_test1 is v_case number(3): 100; beginif 2>1 thendbms_output.put_line(成立);elsif 4>3 thenif 7>6 thendbms_output.put_line(不成立);end if; elsif 6>5 thendbms_output.put_line(也行);elsedbms_output.put_line(也不成立);…

postgresql9.5 run 文件linux安装后配置成开机服务

网上出现的比较多安装方法要么是源码安装&#xff0c;要么是yum安装&#xff0c;我发觉都要配置很多属性&#xff0c;比较麻烦&#xff0c;所以现在我在centos7长用 run文件来安装 http://get.enterprisedb.com/postgresql/postgresql-9.5.1-1-linux-x64.run 这里的安装shell整…

Windows API GetProcAddress 及demo code

GetProcAddress函数检索指定的动态链接库(DLL)中的输出库函数地址。 函数原型&#xff1a; FARPROC GetProcAddress( HMODULE hModule, // DLL模块句柄 LPCSTR lpProcName// 函数名 ); 参数&#xff1a; hModule [in] 包含此函数的DLL模块的句柄。LoadLibrary、AfxLoadLibrary …

【操作系统】进程管理

进程管理 进程的基本概念 程序的顺序执行及其特征 程序的顺序执行:仅当前一操作(程序段)执行完后&#xff0c;才能执行后续操作。 程序顺序执行时的特征&#xff1a;顺序性&#xff0c;封闭性&#xff0c;可再见性。 前趋图 前趋图(Precedence Graph)是一个有向无循环图&#…

va_list va_start va_end的使用

<pre name"code" class"cpp" style"color: rgb(51, 51, 51); white-space: pre-wrap; word-wrap: break-word;"><strong>一、 从printf()开始</strong> 从大家都很熟悉的格式化字符串函数开始介绍可变参数函数。 原型&#xf…