美文网首页
iframe影响浏览器页面跳转

iframe影响浏览器页面跳转

作者: 一个疯子a | 来源:发表于2020-03-10 12:44 被阅读0次

原因

主要是由于浏览器history记录了iframe嵌入页面的路由信息,这个信息不论是iframe内的地址跳转,还是iframe src的切换,都会被记录,下面给出解决方案

如不涉及iframe内地址的跳转

<iframe ref="iframeWin" width="100%" height="100%" frameborder="0"></iframe>
  setIframe(src) {
      this.$refs.iframeWin.contentWindow.location.replace(src);
    },

原理就是让iframe这个页面只被记录一次,从而实现“this.$router.go(-1)”正常跳转

如涉及iframe内地址的跳转

首先进入页面,记录history length

  created() {
    this.historyLength = window.history.length;
  }

然后在页面返回时获取当前history length,相减即可得知需要返回多少个页面

  backClick() {
      let nowhl = window.history.length;
      let backCount = nowhl - this.historyLength + 1;
      this.$router.go(-backCount);
    }

问题解决了,记录分享一下

相关文章

  • iframe影响浏览器页面跳转

    原因 主要是由于浏览器history记录了iframe嵌入页面的路由信息,这个信息不论是iframe内的地址跳转,...

  • iframe重定向让父级页面跳转

    前言 有内嵌iframe的页面,当session过期时,点击连接重定向后的跳转会在iframe中跳转,在登录页面中...

  • iframe 重定向

    有内嵌iframe的页面,当session过期时,点击连接重定向后的跳转会在iframe中跳转,在登录页面中加入下...

  • 此刻无法理解

    iframe有那些缺点? iframe会阻塞主页面的Onload事件; iframe和主页面共享连接池,而浏览器对...

  • HTML 常用的标签

    iframe 标签 嵌套页面 a 标签 跳转页面(HTTP GET 请求) 属性见 MDN:https://dev...

  • R9-常见标签详解

    1. iframe - 嵌套页面 MDN eg: frameborder 控制边框 2. a - 跳转页面(H...

  • 常见标签详解

    iframe 标签 嵌套页面 a 标签 跳转页面(HTTP GET 请求) 属性见 MDN:https://dev...

  • 2019-03-04 HTML标签

    iframe 标签 嵌套页面 a 标签 跳转页面(HTTP GET 请求) 属性见 MDN:https://dev...

  • 转 iframe链接跳转知识

    一、背景A,B,C,D都是jsp,D是C的iframe,C是B的iframe,B是A的iframe,在D中跳转页面...

  • WebViewJavascriptBridge原理解析

    浏览器拦截请求通过JS里面创建一个iframe窗口改变iFrame的src, 相当于浏览器实现了跳转因此nativ...

网友评论

      本文标题:iframe影响浏览器页面跳转

      本文链接:https://www.haomeiwen.com/subject/rtlwdhtx.html