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 相关文章推荐
jquery tab插件制作实现代码
Jun 22 Javascript
jQuery下通过$.browser来判断浏览器.
Apr 05 Javascript
js读取配置文件自写
Feb 11 Javascript
Jquery常用的方法汇总
Sep 01 Javascript
微信小程序中多个页面传参通信的学习与实践
May 05 Javascript
详解JavaScript按概率随机生成事件
Aug 02 Javascript
vue自定义filters过滤器
Apr 26 Javascript
实例详解Vue项目使用eslint + prettier规范代码风格
Aug 20 Javascript
简单了解vue中的v-if和v-show的区别
Oct 08 Javascript
js实现打字小游戏
Dec 17 Javascript
js实现上传按钮并显示缩略图小轮子
May 04 Javascript
Vue 简单实现前端权限控制的示例
Dec 25 Vue.js
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
建立文件交换功能的脚本(一)
2006/10/09 PHP
PHP统计二维数组元素个数的方法
2013/11/12 PHP
PHP处理会话函数大总结
2015/08/05 PHP
PHP的Yii框架中移除组件所绑定的行为的方法
2016/03/18 PHP
CodeIgniter 完美解决URL含有中文字符串
2016/05/13 PHP
IE中createElement需要注意的一个问题
2010/07/13 Javascript
javascript数组输出的两种方式
2015/01/13 Javascript
JS实现文字放大效果的方法
2015/03/03 Javascript
JavaScript中判断两个字符串是否相等的方法
2015/07/07 Javascript
jQuery实现响应鼠标背景变化的动态菜单效果代码
2015/08/27 Javascript
ECMA5数组的新增方法有哪些及forEach()模仿实现
2015/11/03 Javascript
js下载文件并修改文件名
2017/05/08 Javascript
浅谈angular4 ng-content 中隐藏的内容
2017/08/18 Javascript
JS中双击和单击事件冲突的解决方法
2018/04/09 Javascript
[03:46]DOTA2英雄基础教程 维萨吉
2013/12/11 DOTA
在Python下尝试多线程编程
2015/04/28 Python
Python中常用操作字符串的函数与方法总结
2016/02/04 Python
Python numpy实现数组合并实例(vstack,hstack)
2018/01/09 Python
pytorch 状态字典:state_dict使用详解
2020/01/17 Python
python利用datetime模块计算程序运行时间问题
2020/02/20 Python
使用 Python 遍历目录树的方法
2020/02/29 Python
python画环形图的方法
2020/03/25 Python
简单了解Django项目应用创建过程
2020/07/06 Python
英国计算机产品零售商:Novatech(定制个人电脑、笔记本电脑、工作站和服务器)
2018/01/28 全球购物
意大利中国电子产品购物网站:Geekmall.com
2019/09/30 全球购物
土木工程应届生自荐信
2013/09/24 职场文书
3D空间设计学生找工作的自我评价
2013/10/28 职场文书
测控技术与通信工程毕业生自荐信范文
2013/12/28 职场文书
旷课检讨书1000字
2014/02/14 职场文书
《在家里》教后反思
2014/03/01 职场文书
感恩之星事迹材料
2014/05/03 职场文书
企业法人授权委托书
2014/09/25 职场文书
党的群众路线教育实践活动心得体会(企业)
2014/11/03 职场文书
安全员岗位职责
2015/02/10 职场文书
三好学生竞选稿范文
2019/08/21 职场文书
CKAD认证中部署k8s并配置Calico插件
2022/03/31 Servers