Javascript页面跳转常见实现方式汇总


Posted in Javascript onNovember 28, 2015

本文实例总结了Javascript页面跳转常见实现方式。分享给大家供大家参考,具体如下:

概述

相信很多Web开发者都知道,在开发Web程序的时候,对于页面之间的跳转,有很多种,但是有效的跳转则事半功倍,下面就是我在平时的开发过程中所用到的一些JavaScript跳转方式,拿出和大家共享一下。

第一种:直接跳转加参数

<script language="javascript" type="text/javascript">
  window.location.href="login.jsp?backurl="+window.location.href; 
</script>

直接跳转无参数:

<script>window.location.href='http://www.baidu.com';</script>

第二种:返回上一次预览界面
<script language="javascript">
alert("返回");
window.history.back(-1);
</script>

标签嵌套:

<a href="javascript:history.go(-1)">返回上一步</a>
<a href="<%=Request.ServerVariables("HTTP_REFERER")%>">返回上一步</a>

第三种:指定跳转页面 对框架无效。

<script language="javascript">
 window.navigate("top.jsp");
</script>

第四种:指定自身跳转页面 对框架无效。

<script language="JavaScript">
 self.location='top.htm';
</script>

第五种:指定自身跳转页面 对框架有效。

<script language="javascript">
 alert("非法访问!");
 top.location='xx.aspx';
</script>

第六种:按钮式 在button按钮添加 事件跳转

<input name="pclog" type="button" value="GO" onClick="location.href='login.aspx'">

第七种:在新窗口打开:

<a href="javascript:" onClick="window.open('login.aspx','','height=500,width=611,scrollbars=yes,status=yes')">开新窗口</a>

 
应用实例:
<head> 
<script language="javascript">
function old_page() 
{ 
window.location = "login.aspx" 
} 
function replace() 
{ 
window.location.replace("login.aspx") 
} 
function new_page() 
{ 
window.open("login.aspx") 
} 
</script> 
</head> 
<body> 
<input type="button" onclick="new_page()" value="在新窗口打开s"/> 
<input type="button" onclick="old_page()" value="跳转后有后退功能"/> 
<input type="button" onclick="replace()" value="跳转后没有后退功能"/> 
</body>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
window.open关于浏览器拦截问题分析及解决方法
Feb 05 Javascript
js获取指定的cookie的具体实现
Feb 20 Javascript
原生js仿jq判断当前浏览器是否为ie,精确到ie6~8
Aug 30 Javascript
node.js中的http.createClient方法使用说明
Dec 15 Javascript
Css3制作变形与动画效果
Jul 24 Javascript
JavaScript数组对象实现增加一个返回随机元素的方法
Jul 27 Javascript
JavaScript语言精粹经典实例(整理篇)
Jun 07 Javascript
JS中页面与页面之间超链接跳转中文乱码问题的解决办法
Dec 15 Javascript
使用vue.js2.0 + ElementUI开发后台管理系统详细教程(一)
Jan 21 Javascript
ReactNative 之FlatList使用及踩坑封装总结
Nov 29 Javascript
用vue写一个日历
Nov 02 Javascript
在JavaScript中如何使用宏详解
May 06 Javascript
Javascript编程之继承实例汇总
Nov 28 #Javascript
Javascript编程中几种继承方式比较分析
Nov 28 #Javascript
详解JavaScript的变量和数据类型
Nov 27 #Javascript
详解基于Bootstrap扁平化的后台框架Ace
Nov 27 #Javascript
Bootstrap精简教程
Nov 27 #Javascript
Bootstrap每天必学之标签与徽章
Nov 27 #Javascript
Bootstrap每天必学之导航条
Nov 27 #Javascript
You might like
PHP Directory 函数的详解
2013/03/07 PHP
反射调用private方法实践(php、java)
2015/12/21 PHP
ThinkPHP使用getlist方法实现数据搜索功能示例
2017/05/08 PHP
PHP7 windows支持
2021/03/09 PHP
Javascript中的数学函数
2007/04/04 Javascript
JavaScript中的onerror事件概述及使用
2013/04/01 Javascript
浅析jQuery对select操作小结(遍历option,操作option)
2013/07/04 Javascript
深入理解JS中的变量及作用域、undefined与null
2014/03/04 Javascript
jQuery实现的个性化返回底部与返回顶部特效代码
2015/10/30 Javascript
url中的特殊符号有什么含义(推荐)
2016/06/17 Javascript
基于bootstrap实现广告轮播带图片和文字效果
2016/07/22 Javascript
微信小程序组件 marquee实例详解
2017/06/23 Javascript
浅谈React Native Flexbox布局(小结)
2018/01/08 Javascript
vue-socket.io跨域问题有效解决方法
2020/02/11 Javascript
js中switch语句的学习笔记
2020/03/25 Javascript
vue项目查看vue版本及cli版本的实现方式
2020/10/24 Javascript
vue+Element-ui实现登录注册表单
2020/11/17 Javascript
[01:17:55]VGJ.T vs Mineski 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/20 DOTA
python中的字典详细介绍
2014/09/18 Python
Python易忽视知识点小结
2015/05/25 Python
Python os模块学习笔记
2015/06/21 Python
Tornado 多进程实现分析详解
2018/01/12 Python
Python模块WSGI使用详解
2018/02/02 Python
使用python实现语音文件的特征提取方法
2019/01/09 Python
树莓派安装OpenCV3完整过程的实现
2019/10/10 Python
详解Pycharm出现out of memory的终极解决方法
2020/03/03 Python
python给视频添加背景音乐并改变音量的具体方法
2020/07/19 Python
Jo Malone美国官网:祖玛珑香水
2017/03/27 全球购物
JD Sports丹麦:英国领先的运动时尚零售商
2020/11/24 全球购物
采购求职信
2014/03/17 职场文书
课外活动实习计划
2015/01/19 职场文书
学习与创新自我评价
2015/03/09 职场文书
幼儿教师师德培训心得体会
2016/01/09 职场文书
2016年度农村党员干部主题教育活动总结
2016/04/06 职场文书
python 如何在 Matplotlib 中绘制垂直线
2021/04/02 Python
关于JavaScript轮播图的实现
2021/11/20 Javascript