javascript 多个frame之间的交互
主页面 Web.html (加载了两个frame 分别为A.html)
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<div >
<iframe name="frame1" src="A.html"></iframe>
<iframe name="frame2" src="B.html"></iframe>
<button id="webbt">webbt</button>
</div>
<script type="text/javascript">
//在主页面中top parent window 三者相等
var frame1= top.frames.frame1; //也可以通过[]来获取
frame1.onload=function(){
frame1.document.getElementById('pagea').addEventListener('click',function(){
alert("主页面调用 A子页面，为page A按钮绑定了点击事件");
});
}
</script>
</body>
</html>
A.html
<html lang="en">
<head> <!-- Le styles -->
<meta charset="utf-8">
</head>
<body>
<div >
<button id="pagea">PageA</button>
<div style="height: 200px;width: 200px" contenteditable="true"></div>
</div> <!-- container -->
<script type="text/javascript">
window.onload=function(){
top.document.getElementById('webbt').addEventListener('click',function(){
alert("A操作父页面，为webbt按钮绑定了点击事件");
});
};
var frame2=top.frames.frame2; //可以通过parent获取上一级的文档，top获取最顶级的文档
frame2.onload=function(){
frame2.document.getElementById('pageb').addEventListener('click',function(){
alert("A 操作B页面中的元素，为pageb按钮绑定了点击事件");
});
}
</script>
</body>
</html>
B.html
<html lang="en">
<head> <!-- Le styles -->
<meta charset="UTF-8">
</head>
<body>
<div >
<button id="pageb">PageB</button>
</div> <!-- container -->
</body>
</html>
javascript 多个frame之间的交互的更多相关文章
- 在android中实现webview与javascript之间的交互(转）
参见“在android中实现webview与javascript之间的交互”
- frame与frame之间怎么用jquery传值
frame与frame之间如何用jquery传值 使用jquery操作iframe 1. 内容里有两个ifame <iframe id="leftiframe"...< ...
- WebBrowser一点心得，如果在Javascript和Winform代码之间实现双向通信
原文:WebBrowser一点心得,如果在Javascript和Winform代码之间实现双向通信 最近工作需要,学习了一下winform内嵌webbrowser控件,然后与htm页面中的javasc ...
- Mui --- app与服务器之间的交互原理、mui ajax使用
1.APP与服务器之间的交互原理 app端(客户端)与服务端的交互其实理解起来和容易,客户端想服务器端发送请求,服务器端进行数据运算后返回最终结果.结果可以是多种格式: 1.text 文本格式 2.x ...
- 第四节：Vuejs组件及组件之间的交互
一. 组件及其交互 1.组件的注册 (1).全局注册 Vue.component('组件名称', { }) 第1个参数是标签名称,第2个参数是一个选项对象. 选项参数包括 data:必须是一个func ...
- 小程序中的web-view与h5网页之间的交互
官方文档:https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html web-view 基础库 1.6.4 开始支 ...
- 我的Android第五章：通过Intent实现活动与活动之间的交互
Intent在活动的操作 作用: Itent是Android程序中各个组件直接交换的一个重要方式可以指定当前组件要执行任务同时也可以给各个组件直接进行数据交互 同时Inten ...
- Fragments之间的交互(实现参数传递)
Fragments之间的交互(实现参数传递) 日常开发中,通常Fragments之间可能需要交互,比如基于用户事件改变Fragment的内容.所有Fragment之间的交互需要通过他们关联的Activ ...
- AngularJs-指令和指令之间的交互（动感超人）
前言: 上节我们学习到了指令和控制器之间的交互,通过给指令添加动作,调用了控制器中的方法.本节我们学习指令和指令之间是如何交互的,我们通过一个小游戏来和大家一起学习,听大漠老师说这是国外的人写的dem ...
随机推荐
- 【洛谷】P2694 接金币（排序）
题目描述 在二维坐标系里,有N个金币,编号0至N-1.初始时,第i个金币的坐标是(Xi,Yi).所有的金币每秒向下垂直下降一个单位高度,例如有个金币当前坐标是(xf, yf),那么t秒后金币所在的位置 ...
- 分析java类的初始化契机
分析java类的静态成员变量初始化先于非静态成员变量 依上图中当class字节码文件被jvm虚拟机加载到内存中依次经过 连接 验证:对字节码进行验证 准备:给静态变量分配内存并赋予变量类型各自的默 ...
- B2B，ERP，SCM
B2B: B2B电子商务平台是指一个市场的领域的一种,是企业对企业之间的营销关系.电子商务是现代B2B marketing的一种具体主要的表现形式.网商通过它将企业内部网,通过B2B网站与客户紧密结合 ...
- 脱壳系列(四) - eXPressor 壳
先用 PEiD 查一下壳 用 OD 载入程序 这里有一串字符串,是壳的名称和版本号 按 Alt+M 显示内存窗口 这里只有三个区段,后面两个是壳生成的,程序的代码段也包含在里面 利用堆栈平衡 按 F8 ...
- OD 实验(二十) - 对反调试程序的逆向分析(一)
程序: Keyfile.dat 里的内容 该文件中要至少有 9 个 ReverseMe.A: 运行程序 用 OD 打开该程序,运行 弹出的是错误的对话框 该程序发现 OD 对它的调试,所以该程序对 O ...
- C#命名规则和风格(收集)
1. 文件命名组织 1-1文件命名 1. 文件名遵从Pascal命名法,无特殊情况,扩展名小写. 2. 使用统一而又通用的文件扩展名: C# 类 .cs 1-2文件 ...
- azkaban平台的使用
最近接触一些大数据的测试,有些hadoop/spark任务在服务器测试不太方便,会放到azkaban上跑 简单写下azkaband的使用流程:包括任务的上传和提交任务到hadoop集群 一 登陆azk ...
- 深入浅出 Java Concurrency (15): 锁机制 part 10 锁的一些其它问题
主要谈谈锁的性能以及其它一些理论知识,内容主要的出处是<Java Concurrency in Practice>,结合自己的理解和实际应用对锁机制进行一个小小的总结. 首先需要强调的 ...
- python开发_python中for循环操作
如果你对python中的for循环不是很清楚,请看看这篇文章:”for循环控制语句——菜鸟的Python笔记“ 下面是我做的一些学习记录供大家参考: #基本的for循环语句 test_list = [ ...
- IAR安装破解教程
主要讲解IAR软件安装及破解使用 1.下载安装包.注册机 2.点击安装程序 ~ 点击第二个选项进行安装 ~ 然后一直next,再选择安装路径 继续next开始安装,等个五分钟左右即可安装完成 2.破解 ...