iframe 跨域调用父级方法的方案
一、如果高层域名相同的话,可以通过document.domain来实现跨域访问
例如:
父级域名:localhost:8080
子级域名:localhost:9090
那么可以设置document.domain = 'localhost' 来实现跨域访问
二、如果域名没有相同之处
先来做一个假设:假如
我现在有两个系统,一个是工作流服务平台,其中一个功能就是“代办”;
另一个是OA系统,现在我要在OA系统中直接嵌入工作流服务平台的代办页面,而代办页面的中,点击处理又会打开OA系统提供的审批页面,审批页面中有个按钮“同意”;
工作流程服务平台的代办页面为 db.html,OA系统提供的审批页面为 sp.html,当在sp.html中点击“同意”按钮后,要求代办页面更新数据。
1.工作流服务平台需要的代码:(假设域名为localhost:9090)
db.html: (子页面是sp.html)
<html>
<script>
function refresh(){
document.getElementById('data').innerHTML = '2222';
}
</script>
<body>
<div id="data">111</div>
</body>
</html>
execRefresh.html: (这是实现跨域的关键)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title> exec main function </title>
</head> <body>
<script type="text/javascript">
parent.parent.refresh(); // execute main function
</script>
</body>
</html>
2.OA系统需要的代码:(假设域名为 127.0.0.1:9090)
sp.html(是db.html的子页面)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title> iframe window </title> <script type="text/javascript"> // exec main function
function exec_main(){
if(typeof(exec_obj)=='undefined'){
exec_obj = document.createElement('iframe');
exec_obj.name = 'tmp_frame';
exec_obj.src = 'http://localhost:9090/zz/execRefresh.html';
exec_obj.style.display = 'none';
document.body.appendChild(exec_obj);
}else{
exec_obj.src = 'http://localhost:9090/zz/execRefresh.html?' + Math.random();
}
}
</script> </head> <body>
<p>B.html iframe</p>
<p><input type="button" value="同意" onclick="exec_main()"></p>
</body>
</html>
注:请重点注意红色字体
iframe 跨域调用父级方法的方案的更多相关文章
- 子页面iframe跨域执行父页面定义的JS方法
问题需求:父页面与子页面iframe跨域嵌套,子页面要触发父页面所定义的js方法.父子页面的数据传递. 下文中会用到一些文件:父页面: parent.html嵌在父页面的子iframe页面:child ...
- 跨域调用接口的方法之一:$.ajaxSetup()
跨域查询接口的数据,之前在公司时有发生过,产生的原因是,本地请求的域名或IP地址不一致,解除方法,也是修改域名和IP地址.比如: 接口中的数据来自IP地址:192.168.1.23/get.php 如 ...
- Js跨域、父级窗口执行JS赋值、取值,更改元素
网站域名: A:http://www.xxoo.com/a.html B:http://www.aabb.com/b.html B网站嵌套与A网站(A的a中的Iframe指向B中的b)b要让父级a页面 ...
- layer.open打开iframe页面的调用父页面方法及关闭
//调用父类方法 window.parent.exportData($('#shownum').val(),$('#splitstr').val()); //关闭iframe页面var index = ...
- jquery Ajax跨域调用WebServices方法
由于公司需要开发一个手机页面,想提供给同事直接在手机上可以查询SAP资料.数据需要使用js调用webserver来获取. 因为初次使用Jquery调用Webserver,所以期间并不顺利.测试调用We ...
- Flutter子组件调用父组件方法修改父组件参数
子组件调用父级组件方法的主要实现是父组件给子组件传入一个方法,然后在子组件中调用父级方法来修改父级的参数.看一下效果图 父级组件实现 在父级组件中写一个_editParentText的方法来修改组件中 ...
- 谷歌、火狐浏览器下实现JS跨域iframe高度自适应的完美解决方法,跨域调用JS不再是难题!
谷歌.火狐浏览器下实现JS跨域iframe高度自适应的解决方法 导读:今天开发的时候遇到个iframe自适应高度的问题,相信大家对这个不陌生,但是一般我们都是在同一个项目使用iframe嵌套页面,这个 ...
- JS跨域(ajax跨域、iframe跨域)解决方法及原理详解(jsonp)
这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...
- IFrame跨域处理方法-Javascript
在漫长的前端开发旅途上,无可避免的会接触到ajax,而且一般情况下都是用在同一域下的ajax请求:但是如果请求是发生在不同的域下,请求就无法执行,并且会抛出异常提示不允许跨域请求,目前我没有找到明确的 ...
随机推荐
- jQuery Growl插件(消息提醒)
ps:菜鸟教程 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <s ...
- js 判断 undefined,单选 以及下拉框选中状态
name = $(this).attr("title"); if(typeof(name) == 'undefined'){ alert(1); } typeof 函数 radio ...
- Java潜在的坑持续总结
1.Java里如果有if (foo == 0),如果foo是null这里居然是会抛NPE异常而不是返回false: 2.Java里整形数值不能用==来比较,因为只有区间是[-128,127]的才能这么 ...
- 重启随机游走算法(RWR:Random Walk with Restart)
1 pagerank算法的基本原理 Pagerank算法是Google的网页排名算法,由拉里佩奇发明.其基本思想是民主表决.在互联网上,如果一个网页被很多其他网页所链接,说明它受到普遍的承认和信赖,那 ...
- Java实现FTP批量大文件上传下载篇1
本文介绍了在Java中,如何使用Java现有的可用的库来编写FTP客户端代码,并开发成Applet控件,做成基于Web的批量.大文件的上传下载控件.文章在比较了一系列FTP客户库的基础上,就其中一个比 ...
- 查看Redis集群所有节点内存工具
指定集群中任意一个节点,查看集群中所有节点当前已用物理内存.配置的最大物理内存和系统物理内存. 源码(可从https://github.com/eyjian/redis-tools下载): #! ...
- ArcGIS 点云转DEM
- Android-Java-面向对象与面向过程举例
例子一: 面向过程 在生活中的体现: 李四去饭店吃饭,进入风华高档餐饮店后,首先不理服务员,然后冲进厨房,推开厨师,自己开煤气,自己切菜,自己炒菜,自己调料,炒好后自己端出来,然后吃,吃完后 买单 面 ...
- Aggregate类型以及值初始化
引言 在C++中,POD是一个极其重要的概念.要理解POD类型,我们首先需要理解Aggregate类型.下文结合stackoverflow上的高票回答将对Aggregate类型做一个全面的解读. 对于 ...
- 三、winForm-DataGridView操作——DataGridView 操作复选框checkbox
一.添加复选框 ArrayList arr = new ArrayList(); public string checkboxName = "选择"; void StandLibW ...