iframe中如果只是页面跳转的话，我们依然只是部分的加载的了，为了实现整个页面的所有内容跳转，下面提供了整个页面跳转的方法。

iframe例子

1、总的iframe页面（访问就访问这个）  all.html

<frameset rows="45%,*" frameborder=0 framespacing=10>

<frame src="top.html" noresize/>

<frameset cols="20%,*" >

<frame src="left.html" noresize/>

<frame src="right1.html" name="right"/>

</frameset>

</frameset>

2、top.html （上不的页面）

<html>

<body>

 <img src="1111.jpg" width=410/>

</body>

</html>

3、left.html  (左下方的页面)

<body bgcolor="pink">

 <a href="right1.html" target="right">清华1</a><br>

 <a href="right2.html" target="right">清华2</a><br>

 <a href="login.html" target=_top>退出</a>　　<!-- 这个会跳出整个页面 -->
 <a href="#" onclick="top.location.href='login.html'">退出2</a>    <!-- 这个会跳出整个页面 -->
 </body> </html>

4、right1.html （右下方页面1）

<html>

<body bgcolor="green">

 right1

</body>

</html>

5、right2.html （右下方页面2）

<html>

<body>

 right2

</body>

</html>

6、login.html

<html>

<body>

登陆界面

</body>

</html>

7、效果图

整个页面跳转——实现登陆退出

　　在手动改HTML代码时经常会用到target参数，常用的有两个target=_blank 和target=_self意思为：
　　target=_blank表示在新窗口中打开该链接；
　　target=_self表示相同框架，即在当前窗口（或当前选项卡）中打开该链接
　　还有两个不常用的：
　　target=_parent，将链接的文件载入含有该链接框架的父框架集或父窗口中。如果含有该链接的框架不是嵌套的，则在浏览器全屏窗口中载入链接的文件，就象_self参数一样。 
　　target=_top，在当前的整个浏览器窗口中打开所链接的文档，因而会删除所有框架 
　　不写的话就是表示默认值，默认值一般跟浏览器有关。

　　比如网A中镶嵌iframe了网页B，网页B又镶嵌iframe了网页C

　　如果网页C中连接设置target=_parent，则跳将网页B去掉直接A中嵌入网页C中链接页面;
　　而如果网页C中target=_top ，则直接跳出所有iframe框架，直接转向C中链接页面。

　　如果是在iframe中退出登录，这样就可以了。Response.Write("<script>top.location.href=\"/Login.aspx\"</script>");

　　致谢：感谢您的耐心阅读！

iframe 的使用和登陆退出的实现——整个页面跳转的更多相关文章

  1. laravel前后端分离的用户登陆 退出 中间件的接口与session的使用

    在项目开发的过程中,需要有用户的登陆 退出 还有校验用户是否登陆的中间件; 基本思路: 登陆: 前端请求接口的参数校验 用户名 密码规则的校验 用户名密码是否正确的校验; 如果上面的校验都通过的了,把 ...

  2. Yii2 前后台登陆退出分离、登陆验证

    这里用的yii2高级模板, 基本模板的配置文件在一个文件里,方法基本没什么区别, 1.用户表要有两个用户表, 当然一个也行,分开是省得麻烦,既然是分离了就彻底分开, 前台表user,后台表user_b ...

  3. ionic3.x版本-实现点击tab导航栏判断是否已经登陆然后加载不同页面，和退出登录功能。

    html代码: <ion-tabs #myTabs> <ion-tab [root]="tab1Root" tabTitle="首页" tab ...

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

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

  5. Django auth 登陆后页面跳转至/account/profile，修改跳转至其他页面

    这几天在学习django,django功能很强大,自带的auth,基本可以满足用户注册登陆登出,简单的用户注册登陆系统使用django auth足矣.当然也不是拿来就能用的,需要自己写登陆页面的模板, ...

  6. [ExtJS5学习笔记]第二十五节 利用window.open()函数实现ExtJS5的登陆页面跳转

    本文地址:http://blog.csdn.net/sushengmiyan/article/details/40427543 mvvm方式实现登陆的博客:http://blog.csdn.net/s ...

  7. __x__(14)0906第三天__<iframe> 内联框架 引入有一个外部html页面

    在现实开发中,不推荐使用内联框架,因为<iframe></iframe>中的内容不会被搜索引擎检索. 在特殊情况中,如内网项目,不用放在互联网上时,可以使用<iframe ...

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

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

  9. javascript控制页面（含iframe进行页面跳转）跳转、刷新的方法汇总

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

随机推荐

  1. Web Service代理类生成工具

    本文原文连接:http://www.cnblogs.com/dengxinglin/p/3334158.html 之前一篇文章写 Web Service服务代理类生成及编译 , 通过命令行的方式可以直 ...

  2. ajax的再次封装！(改进版) —— new与不 new 有啥区别？

    生命不息重构不止! 上一篇写了一下我对ajax的再次封装的方法,收到了很多有价值的回复,比如有童鞋建议用$.extend,一开始还以为要做成插件呢,后来才知道,原来这个东东还可以实现合并.省着自己再去 ...

  3. Typescript 中类的继承

    Typescript中类的定义与继承与后端开发语言java/C#等非常像,实现起来非常方便,而且代码便于阅读. 用Typescript写较大项目时是非常有优势的. /** * BaseClass */ ...

  4. 25佳漂亮的结婚邀请 & 婚礼请柬网站设计

    互联网给我们的生活带来了巨大的变化,越来越多的事情可以通过网络完成.下面向大家分享一组结婚邀请网站以及婚礼请柬网站的设计案例,如果你也正想制作这样的网站,相信这些优秀案例能够带给你很大的帮助. 您可能 ...

  5. 【初探Underscore】再说模版引擎

    前言 Underscore 是一个JavaScript实用库,提供了类似Prototype.js (或 Ruby)的一些功能,但是没有扩展任何JavaScript内置对象. 它弥补了部分jQuery没 ...

  6. 【javascript激增的思考01】模块化编程

    前言 之前我做过一个web app(原来可以这么叫啦),在一个页面上有很多小窗口,每个小窗口都是独立的应用,比如: ① 我们一个小窗口数据来源是腾讯微博,需要形成腾讯微博app小窗口 ② 我们一个小窗 ...

  7. php 过滤英文标点符号 过滤中文标点符号

    php 过滤英文标点符号 过滤中文标点符号 代码 function filter_mark($text){ if(trim($text)=='')return ''; $text=preg_repla ...

  8. [deviceone开发]-拼图小游戏

    一.简介 九宫格小游戏,可从本地图库载入一张图片,填充到9个ImageView,另涉及Timer计时.图库控件. 每个格子都是相同的控件,动态添加到首页中的,在初始化后,响应touch事件,之后通过多 ...

  9. abap--How to debug backgroud job

    最近被一个朋友问起如何调试后台进程(一个abap的面试题),我一时也不知道如何答,他后来告诉我到sdn上找答案,我现在将答案收集供大家参考:Steps 1. Create variant called ...

  10. 阿里云上部署 centos+nodejs+mongodb

    先执行 yum -y update nginx 安装 yum -y install nginx 设置开机启动 chkconfig nginx on nodejs 安装: yum install nod ...