一:跨域获取iframe页面的url

1.在使用iframe页面的js添加以下内容

  1. <script>
  2. var host = window.location.href;
  3. var historyUrl = "";
  4. window.addEventListener('message', function (rs) {
  5. var href = rs.data;
  6. if (href != "" && href != host && href != undefined) {
  7. historyUrl = href;
  8. }
  9. });
  10. //父页面控制iframe页面的返回
  11. function runBack() {
  12. console.log(historyUrl)
  13. if (historyUrl != "" && historyUrl != undefined) {
  14. var ifra = document.getElementById("content_info");
  15. ifra.src = historyUrl;
  16. }
  17. }
  18. </script>

2.iframe引用的(内嵌)页面添加一下内容:

  1. <script>
  2. //返回iframe内嵌页面的Url
  3. //window.parent.postMessage(window.location.href,"*");
  4.  
  5. //返回iframe内嵌页面的上一级Url
  6. window.parent.postMessage(document.referrer,"*");
  7. </script>

3.效果

1)一开始进来的页面:

2)点击“Second Page”跳到Second Page页面

3).通过点击左上角的“返回”按钮,返回First Page页面

跨域获取iframe页面的url的更多相关文章

  1. 如何实现跨域获取iframe子页面动态的url

    有的时候iframe的子页面会动态的切换页面,我们在父页面通过iframe1.contentWindow.window.location只能获取同源的子页面的信息.获取跨域的子页面信息会报错. 这时可 ...

  2. 利用location.hash+iframe跨域获取数据详解

    前言 如果看懂了前文利用window.name+iframe跨域获取数据,那么此文也就很好理解了.一样都是动态插入一个iframe,然后把iframe的src指向服务端地址,而服务端同样都是输出一段j ...

  3. 利用window.name+iframe跨域获取数据详解

    详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...

  4. iframe 跨域问题解决方案 利用window.name+iframe跨域获取数据详解

    详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...

  5. 转载: js jquery 获取当前页面的url,获取frameset中指定的页面的url(有修改)

    转载网址:http://blog.csdn.net/bestlxm/article/details/6800077 js jquery 怎么获取当前页面的url,获取frameset中指定的页面的ur ...

  6. js中如何获取页面的Url,域名和端口号

    有时候通过获取上个页面的Url来做一个跳转,获取域名防止非正常访问 获取上一个页面的一个URL,这个URL一般做一个页面的跳转 window.location.href <script>w ...

  7. PHP 获取上一个页面的url

    php $_SERVER["HTTP_REFERER"]变量可以获取上一个或前一个页面的URL地址. 比如有一个a.php页面,这个页面上有一个链接指向b.php页面,如果我们在a ...

  8. JS跨域(ajax跨域、iframe跨域)解决方法及原理详解(jsonp)

    这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...

  9. 允许CEF跨域访问iframe

    默认情况下,如果嵌入本地Web页面,并在页面内部使用iframe来显示一个在线页面,加载的过程中会触发一个未捕获异常,虚函数CefV8ContextHandler::OnUncaughtExcepti ...

  10. 【转】JS跨域(ajax跨域、iframe跨域)解决方法及原理详解(jsonp)

    这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...

随机推荐

  1. ubuntu20.04系统中扩展swap分区

    1.首先停止/swapfile #swapon /swapfile 2.删除以前的/swapfile #rm -rf swapfile 3.创建新的/swapfile(以2G为例) #dd if=/d ...

  2. protobuf笔记

    protobuf的enum .proto的enum类型在编译后,是C++的enum

  3. 百度云+Zotero进行知识管理的方法

    首先,要在zotero的首选项的文件与文件夹里去自定义你的zotero文件夹,这个文件夹就是你的zotero软件的文档存储编辑的文件夹,本来默认是在电脑用户里自动创建的,比如hp/user/zoter ...

  4. ALV值存放图标

    SPAN { font-family: "新宋体"; font-size: 12pt; color: rgba(0, 0, 0, 1); background: rgba(255, ...

  5. 【6】python之时间模块

    时间模块(time和datetime) 表示时间的方式: 1.时间戳(1970至今的时间间隔总秒数) 2.格式化的字符串(按照固定格式的时间字符串) 3.元组(9个元素形成) ps:UTC世界标准时间 ...

  6. 全新BPMN常用图形标识一览表

    BPMN符号与BPMN的关系 BPMN,即业务流程建模与标记(手法),表达此类手法的即是业务流程模型示意图.业务流程示意图是由一系列的元素符号构成.作为BPMN的基础,这些符号将业务流程建模简单化.图 ...

  7. 【性能监控】nmon和pyNmonAnalyzer的搭建和使用

    1,安装nmon 二进制安装:暂时空着,没有FQ,访问不了nmon的官网. 下载对应操作系统的文件,直接运行: 下载地址:https://pan.baidu.com/s/1gTBh10-ark5gbe ...

  8. 【Java】【Mybatis】如何调用存储过程和存储函数

    https://www.jb51.net/article/230756.htm Mybatis调用存储过程 MyBatis支持使用存储过程的配置.当使用存储过程时,需要设置一个参数"mode ...

  9. js 深拷贝 和 浅拷贝

    1.  ...运算符  (浅拷贝) let obj = {a:1,b:2}; let obj2 = {...obj}; obj.a=3 obj //{a: 3, b: 2} obj2 //{a: 1, ...

  10. fio - IO测试工具

    目前主流的第三方IO测试工具有fio.iometer和Orion,这三种工具各有千秋. fio在Linux系统下使用比较方便,iometer在window系统下使用比较方便,Orion是oracle的 ...