前提:在前一段的工作中碰到了一些页面跳转,子页面跳到父页面上的等等问题,当时页面总是跳不对,或者跳错,要不就是不需要重新打开窗口,却又重新打开一个了,特此搜寻网上各大博客论坛,加上项目经验整理一篇文章,会有后续的修改和更新,如果有错误还希望大家及时指出,谢谢。

一、什么是iframe?

  iframe也称作嵌入式框架,嵌入式框架和框架网页类似,它可以把一个网页的框架和内容嵌入在现有的网页中。  这是一般网页上给出的答案。然而,在说明什么是iframe之前,需要有一点提醒大家,由于iframe有诸多缺点,因此不符合标准网页设计的理念,已经被标准网页设计抛弃,但是美国前 10 大网站都使用了 iframe。在大部分情况下,他们用它来加载广告。这是可以理解的,也是一种符合逻辑的解决方案。但请记住,iframe 会给你的页面性能带来冲击。只要可能,不要使用 iframe。当确实需要时,谨慎的使用他们。

  那么下面就来介绍iframe,我想,没有什么比这幅图片更能解释iframe了,一看就明了。

  iframe就是我们常用的iframe标签:<iframe>。iframe标签是框架的一种形式,也比较常用到,iframe一般用来包含别的页面,超链接指向这个嵌入的网页,只要给这个iframe命名就可以了。方法是<iframe name=**>,例如我命名为aa,写入这句HTML语言<iframe width=420 height=330 name=aa frameborder=0 src=http://host.zzidc.com></iframe>,然后,网页上的超链   接语句应该写为:<a  href=URL target=aa>,而这个连接,就是指图中的衣服下的衬衫 西服 T恤的a连接,这些应该是写在index.html里面的。这样,大家就会对iframe有一个初步的了解了,具体的iframe的样式什么的这里就不做解释了。接下来的页面链接才是重点,毕竟大部分公司已经摒弃了iframe的用法,只有一些框架还选择用iframe。

  二、跳转页面

在最近的项目中遇到的有关跳转页面的目前就这三个:

1.刷新当前页: window.location.reload(true);

2.跳转其他页:window.location.href='此处是接口';      是本页面跳转

3.跳转其他页:window.parent.document.

举例说明:

1、window.location:

  如果A,B,C,D都是jsp,D是C的iframe,C是B的iframe,B是A的iframe,如果D中js这样写  即:A>B>C>D,

    "window.location.href"、"location.href"、"self.location.href":D页面自身跳转(即本页面跳转);
    "parent.location.href":C页面跳转
    "top.location.href":A页面跳转

  刷新页面也是如此。

2.window.parent.document:

  先举一个例子:

    window.parent.document.getElementById("myEle").innerHTML = html;

  即指明了是在 window.parent.document 中查找 id=myEle 的元素,并把它的HTML设置为html.那么用jQuery则应如下:

    1.$("#myEle", window.parent.document).html(html);

    还有一种写法是:

    2.parent.$("#myEle").html(html);

  这些就很好的解释了我在项目中遇见的这段师傅写的代码:

  

  取父窗口的元素方法:$(selector, window.parent.document);
  那么你取父窗口的父窗口的元素就可以用:$(selector, window.parent.parent.document);
  类似的,取其它窗口的方法大同小异
  $(selector, window.top.document);
  $(selector, window.opener.document);
  $(selector, window.top.frames[0].document);

目前就是这么多,会做后续补充~~谢谢~~

iframe及其引出的页面跳转问题的更多相关文章

  1. 使用iframe框架后的页面跳转时目标页面变为iframe的子页面的问题

    <frameset rows="4,200,10,*,120" cols="*" framespacing="0" framebord ...

  2. iframe重定向让父页面跳转

    情景描述 我们在使用一些后台程序的html模板(比如H-ui)的时候,这些html前端程序是iframe版的, 也就是说在使用的时候,每当我点击左侧导航栏的一个按钮,在右侧就会弹出一个菜单栏,在显示的 ...

  3. iframe 的使用和登陆退出的实现——整个页面跳转

    iframe中如果只是页面跳转的话,我们依然只是部分的加载的了,为了实现整个页面的所有内容跳转,下面提供了整个页面跳转的方法. iframe例子 1.总的iframe页面(访问就访问这个)  all. ...

  4. javascript控制页面(含iframe进行页面跳转)跳转、刷新的方法汇总

    一.JS方式的页面跳转1.window.location.href方式    <script language="JavaScript" type="text/ja ...

  5. JS页面跳转和js对iframe进行页面跳转、刷新

    一.js方式的页面跳转1.window.location.href方式    <script language="JavaScript" type="text/ja ...

  6. 利用js对象将iframe数据缓存, 实现子页面跳转后, 返回时不丢失之前填写的数据

    利用js对象将iframe数据缓存, 实现子页面跳转后, 返回时不丢失之前填写的数据 实现描述:将数据存放在js对象中, 然后放在父页面的document对象中, 在页面刷新的时候将父页面的值取出来, ...

  7. iframe中请求页面而session失效时页面跳转问题

    iframe中请求页面而session失效时页面跳转问题 分类: Web2009-12-11 15:01 656人阅读 评论(0) 收藏 举报 sessioniframejsp 有时候做了就忘了,我记 ...

  8. 解决iframe重定向让父级页面跳转

    原文:http://www.jb51.net/article/40583.htm 有内嵌iframe的页面,当session过期时,点击连接重定向后的跳转会在iframe中跳转,在登录页面中加入下面的 ...

  9. 关于使用struts2时子窗体页面跳转后在父窗体打开的问题以及Session过期后的页面跳转问题

    问题1:传统的系统界面,iframe了三个页面,上,左,右,用户点击注销的按钮在上面得top.jsp里面,方法:<a href="../adminAction/admin_logout ...

随机推荐

  1. uCos临界区保护

    定义有三种method,stm32f4采用的是第三种:将当前中断的状态标志保存在一个局部变量cpu_sr中,然后再关闭中断.cpu_sr是一个局部变量,存在于所有需要关中断的函数中.注意到,在使用了该 ...

  2. 域名ip自动跳转 跳转指定页面的js

    域名ip自动跳转 跳转指定页面的js 为了应对百度审核,需要客户的网站在个别地区跳转到另一个页面,就搞到了这段代码,屡试不爽,超实用.下面把地址换成你要访问的网站url地址或者文件url地址即可.超实 ...

  3. LR问题汇总

    关于录制打开IE问题 1.LR11用IE11录制脚本时能打开web页面,但是一直是0事件,也没有脚本代码; 解决方法: LR版本和IE版本兼容性问题,这个问题是我们安装环境时不注意,导致LR无法录制. ...

  4. Swift(一)简单值

    Swift的源文件扩展名是.swift 按照国际惯例,学习一门新语言写的第一个程序都是在屏幕上输出一句 “Hello, world!” .在Swift里,一行代码就搞定了: 如果你以前写过C或者Obj ...

  5. hdu 4763 Theme Section(next数组找串中三段相等)

    题意:在一个串中找 EAEBE 的形式的最长的E,其中E为一个字符串,也就是说找到前缀与后缀相同,并且串中还存在相同的一段,它们不能重复. 思路:利用next数组,next[len]代表的即是最大的相 ...

  6. mysql忘记root用户密码找回步骤

    修改或找回root密码步骤1.修改MySQL的登录设置: # vi /etc/my.cnf 在[mysqld]的段中加上一句:skip-grant-tables 保存并且退出vi. 2.重新启动mys ...

  7. 探索Oracle11gR2 之 DataGuard 三种保护模式

    Oracle的DataGuard技术有三种实现模式,分别是max performance.max availability.maxprotection这三种模式. 以下是来自Oracle文档的摘要信息 ...

  8. BZOJ_1264_[AHOI2006]基因匹配Match_树状数组

    BZOJ_1264_[AHOI2006]基因匹配Match_树状数组 Description 基因匹配(match) 卡卡昨天晚上做梦梦见他和可可来到了另外一个星球,这个星球上生物的DNA序列由无数种 ...

  9. 【POJ 3461】 Oulipo

    [题目链接] 点击打开链接 [算法] KMP [代码] #include <algorithm> #include <bitset> #include <cctype&g ...

  10. bzoj5073

    dp 字符串dp不太会啊... 这种序列和子串的匹配一般设两个状态,dp[i][j]表示当前s匹配到i,t匹配到j的...,g[i][j]表示当前s匹配到i,t匹配到j,i,j必须匹配的...,noi ...