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 相关文章推荐
Javascript下判断是否为闰年的Datetime包
Oct 26 Javascript
JS特权方法定义作用以及与公有方法的区别
Mar 18 Javascript
JS面向对象基础讲解(工厂模式、构造函数模式、原型模式、混合模式、动态原型模式)
Aug 16 Javascript
浅谈jquery回调函数callback的使用
Jan 30 Javascript
JS特效实现图片自动播放并可控的效果
Jul 31 Javascript
浅析JS获取url中的参数实例代码
Jun 14 Javascript
浅析使用BootStrap TreeView插件实现灵活配置快递模板
Nov 28 Javascript
详解Angular的内置过滤器和自定义过滤器【推荐】
Dec 26 Javascript
bootstrap表格分页实例讲解
Dec 30 Javascript
微信小程序 数据绑定及运算的简单实例
Sep 20 Javascript
解决vue props 拿不到值的问题
Sep 11 Javascript
vue实现在线预览pdf文件和下载(pdf.js)
Nov 26 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生成缩略图填充白边(等比缩略图方案)
2013/12/25 PHP
三个思路解决laravel上传文件报错:413 Request Entity Too Large问题
2017/11/13 PHP
asp函数split()对应php函数explode()
2019/02/27 PHP
对象的类型:本地对象(1)
2006/12/29 Javascript
神奇的代码 通杀各种网站-可随意修改复制页面内容
2008/07/17 Javascript
js 中 document.createEvent的用法
2010/08/29 Javascript
Javascript自定义排序 node运行 实例
2013/06/05 Javascript
用Javascript获取页面元素的具体位置
2013/12/09 Javascript
JS字符串截取函数实例
2013/12/27 Javascript
javascript制作的cookie封装及使用指南
2015/01/02 Javascript
在JavaScript中访问字符串的子串
2015/07/07 Javascript
将 vue 生成的 js 上传到七牛的实例
2017/07/28 Javascript
JavaScript 自定义事件之我见
2017/09/25 Javascript
基于Axios 常用的请求方法别名(详解)
2018/03/13 Javascript
Vue 路由切换时页面内容没有重新加载的解决方法
2018/09/01 Javascript
angular学习之动态创建表单的方法
2018/12/07 Javascript
微信小程序实现的3d轮播图效果示例【基于swiper组件】
2018/12/11 Javascript
前端js中的事件循环eventloop机制详解
2019/05/15 Javascript
javascript设计模式 ? 装饰模式原理与应用实例分析
2020/04/14 Javascript
Express 配置HTML页面访问的实现
2020/11/01 Javascript
nuxt.js 在middleware(中间件)中实现路由鉴权操作
2020/11/06 Javascript
[03:12]TI9战队档案 - Virtus Pro
2019/08/20 DOTA
python安装scipy的方法步骤
2019/06/26 Python
python实现Pyecharts实现动态地图(Map、Geo)
2020/03/25 Python
巴西图书和电子产品购物网站:Saraiva
2017/06/07 全球购物
养殖人员的创业计划书范文
2013/12/26 职场文书
森林病虫害防治方案
2014/06/02 职场文书
艺术学院毕业生自荐信
2014/07/05 职场文书
员工年终自我评价
2014/09/14 职场文书
工作检讨书大全
2015/01/26 职场文书
创卫工作总结2015
2015/04/22 职场文书
创业计划之特色精品店
2019/08/12 职场文书
MySQL GRANT用户授权的实现
2021/06/18 MySQL
Python获取江苏疫情实时数据及爬虫分析
2021/08/02 Python
Android超详细讲解组件ScrollView的使用
2022/03/31 Java/Android
nginx 配置缓存
2022/05/11 Servers