window.location.href的用法(动态输出跳转)


Posted in Javascript onAugust 09, 2014

javascript中的location.href有很多种用法,主要如下。

self.location.href="/url" 当前页面打开URL页面
location.href="/url" 当前页面打开URL页面
windows.location.href="/url" 当前页面打开URL页面,前面三个用法相同。
this.location.href="/url" 当前页面打开URL页面
parent.location.href="/url" 在父页面打开新页面
top.location.href="/url" 在顶层页面打开新页面

如果页面中自定义了frame,那么可将parent self top换为自定义frame的名称,效果是在frame窗口打开url地址

此外,window.location.href=window.location.href;和window.location.Reload()和都是刷新当前页面。区别在于是否有提交数据。当有提交数据时,window.location.Reload()会提示是否提交,window.location.href=window.location.href;则是向指定的url提交数据

在写ASP.Net程序的时候,我们经常遇到跳转页面的问题,我们经常使用Response.Redirect 做ASP.NET框架页跳转,如果客户要在跳转的时候使用提示,这个就不灵光了,如:

Response.Write("< script>alert('恭喜您,注册成功!');< /script>");  

Response.Redirect("main.html");  

这时候我们的提示内容没有出来就跳转了,和Response.Redirect("main.html");没有任何区别。

这时我们采用下面代码试验一下:

ASP.NET框架页跳转的另一实现

Response.Write("< script language=javascript>alert('恭喜您,注册成功!')< /script>");  

Response.Write("< script language=javascript>window.location.href='main.html'< /script>");

这个即实现了我们的要求,在提示后,跳转页面。

最重要的是window.location.href 语句可以实现一个框架的页面在执行服务器端代码后刷新另一个框架的页面(Response.Redirect无法达到,至少我没有发现):

如:index.htm页面中有二个框架,分别为 frameLeft和frameRight,在frameRight页面中执行服务器端代码后刷新frameLeft中的页面。

先前最常见的是注册之后,自动刷新登陆框,让登陆框换成已登陆页面,只要在注册成功的代码之后加上一段,即可以实现刷新另个框架的页面。代码如下:

Response.Write("< script language=javascript>alert('恭喜您,注册成功!')< /script>");  

Response.Write("< script language=javascript>window.parent.frameLeft.location.href='main.html'< /script>");  

这样就搞定了ASP.NET框架页跳转中断的问题。其实asp、php中一般都使用这种方式。

"window.location.href"、"location.href"是本页面跳转
"parent.location.href"是上一层页面跳转
"top.location.href"是最外层的页面跳转

举例说明:

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

"window.location.href"、"location.href":D页面跳转
"parent.location.href":C页面跳转
"top.location.href":A页面跳转

如果D页面中有form的话,

<form>: form提交后D页面跳转
<form target="_blank">: form提交后弹出新页面
<form target="_parent">: form提交后C页面跳转
<form target="_top"> : form提交后A页面跳转
 
关于页面刷新,D 页面中这样写:

"parent.location.reload();": C页面刷新 (当然,也可以使用子窗口的 opener 对象来获得父窗口的对象:window.opener.document.location.reload(); )

"top.location.reload();": A页面刷新

Javascript 相关文章推荐
jquery $.ajax相关用法分享
Mar 16 Javascript
javascript数组遍历for与for in区别详解
Dec 04 Javascript
JS动态添加iframe的代码
Sep 14 Javascript
CSS中position属性之fixed实现div居中
Dec 14 Javascript
jquery实现倒计时功能
Dec 28 Javascript
js 动态生成json对象、时时更新json对象的方法
Dec 02 Javascript
折叠菜单及选择器的运用
Feb 03 Javascript
JS实现上传图片实时预览功能
May 22 Javascript
js 事件的传播机制(实例讲解)
Jul 20 Javascript
深入理解 JS 垃圾回收
Jun 03 Javascript
基于vue.js实现购物车
Jan 15 Javascript
(开源)微信小程序+mqtt,esp8266温湿度读取
Apr 02 Javascript
javascript父、子页面交互技巧总结
Aug 08 #Javascript
jQuery的animate函数学习记录
Aug 08 #Javascript
jQuery中get和post方法传值测试及注意事项
Aug 08 #Javascript
JSON.stringify转换JSON时日期时间不准确的解决方法
Aug 08 #Javascript
js事件监听机制(事件捕获)总结
Aug 08 #Javascript
使用jquery.qrcode生成彩色二维码实例
Aug 08 #Javascript
兼容最新firefox、chrome和IE的javascript图片预览实现代码
Aug 08 #Javascript
You might like
星际RPG字典
2020/03/04 星际争霸
PHP爆绝对路径方法收集整理
2012/09/17 PHP
php中require和require_once的区别说明
2014/02/27 PHP
十幅图告诉你什么是PHP引用
2015/02/22 PHP
详解Yii2高级版引入bootstrap.js的一个办法
2017/03/21 PHP
通过PHP设置BugFree获取邮箱通知
2019/04/25 PHP
php设计模式之原型模式分析【星际争霸游戏案例】
2020/03/23 PHP
js修改地址栏URL参数解决url参数问题
2012/12/15 Javascript
jQuery实现商品活动倒计时
2015/10/16 Javascript
基于JavaScript实现在新的tab页打开url
2016/08/04 Javascript
Canvas实现放射线动画效果
2017/02/15 Javascript
jquery实现表单获取短信验证码代码
2017/03/13 Javascript
微信小程序利用swiper+css实现购物车商品删除功能
2019/03/06 Javascript
js中arguments对象的深入理解
2019/05/14 Javascript
Vue分页效果与购物车功能
2019/12/13 Javascript
extjs图表绘制之条形图实现方法分析
2020/03/06 Javascript
vue的hash值原理也是table切换实例代码
2020/12/14 Vue.js
原生js实现无缝轮播图效果
2021/01/28 Javascript
[02:09:59]火猫TV国士无双dota2 6.82版本详解(下)
2014/09/29 DOTA
[01:06:43]完美世界DOTA2联赛PWL S3 PXG vs GXR 第二场 12.19
2020/12/24 DOTA
Django 前后台的数据传递的方法
2017/08/08 Python
python进程管理工具supervisor的安装与使用教程
2017/09/05 Python
python调用API实现智能回复机器人
2018/04/10 Python
Python面向对象程序设计OOP入门教程【类,实例,继承,重载等】
2019/01/05 Python
详解将Pandas中的DataFrame类型转换成Numpy中array类型的三种方法
2019/07/06 Python
python批量图片处理简单示例
2019/08/06 Python
python 基于卡方值分箱算法的实现示例
2020/07/17 Python
使用CSS3和Checkbox实现JQuery的一些效果
2015/08/03 HTML / CSS
美国知名男士服饰品牌:Brooks Brothers(布克兄弟)
2016/08/25 全球购物
联想加拿大官方网站:Lenovo Canada
2018/04/05 全球购物
美国婚礼礼品网站:MyWeddingFavors
2018/09/26 全球购物
政治思想表现评语
2014/05/04 职场文书
小学教师读书活动总结
2014/07/08 职场文书
前台接待员岗位职责
2015/04/15 职场文书
廉洁自律证明
2015/06/24 职场文书
JAVA SpringMVC实现自定义拦截器
2022/03/16 Python