热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

JAVASCRIPT实现的WEB页面跳转以及页面间传值方法

但有时候,需要当某事件触发时,我们先做一些操作,然后再跳转,这时,就要用JAVASCRIPT来实现这一跳转功能。下面是具体的做法:一:跳转到新页面,并且是在新窗口中打开时:复制代码代码如下:fu
但有时候,需要当某事件触发时,我们先做一些操作,然后再跳转,这时,就要用Javascript来实现这一跳转功能。 
下面是具体的做法: 
一:跳转到新页面,并且是在新窗口中打开时: 
代码如下:
function gogogo() 

//do someghing here... 
window.open("test2.html"); 


window是一个Javascript对象,可以用它的open方法,需要注意的是,如果这个页面不是一相相对路径,那么要加http://,比如: 
代码如下:
function gogogo() 

window.open( "http://www.google.com"); 


二:就在本页面窗口中跳转: 
代码如下:
function totest2() 

window.location.assign( "test2.html"); 


如果直接使用location.assgin()也可以,但是window.location.assign()好像更合理一些,当前窗口的location对象的assign()方法。 
另外,location对象还有一个方法replace()也可以做页面跳转,它跟assign()方法的区别在于: 
replace() 方法不会在 History 对象中生成一个新的纪录。当使用该方法时,新的 URL 将覆盖 History 对象中的当前纪录。 

下面学习如何在页面跳转的时候进行值的传递,当使用window.open()打开新页面时,浏览器会认为这两个窗口之间有一种打开与被打开的关系,所以在被打开的新窗口中在当前窗口的window对象中有一个window.opener 属性,这个值里面放着打开窗口的引用,所以可以获得这个值,进而引用上一页面内的对象的值,示例如下: 

代码如下:
 
 
 
 
 
 
 


 
 
 
 
 


代码如下:
 
 
 
 
 
 
 


 
 
 
 


这两个页面,可以从后一个页面中获得前一个页面中的值,但是我感觉好像不大实用。。。。。。 
优点:取值方便.只要window.opener指向父窗口,就可以访问所有对象. 
不仅可以访问值,还可以访问父窗口的方法.值长度无限制. 
缺点:两窗口要存在着关系.就是利用window.open打开的窗口.不能跨域. 

下面看看另一种方法,使用URL附加字段在页面跳转间传值,前面用XMLHttpRequest时,用到过这种方式。简单原始的示例如下: 

代码如下:
 
 
 
 
 
 
 


 
 
 
 
 
 

代码如下:
 
 
 
 
 
 
 


 
 


 
 
 
 

我记得前面在看XMLHttpRequest的时候有一个QueryString对象可以直接从URL参数中取值,我不清楚这儿可不可以直接用,试了一下好像不行。 

最后一种页面间传值的方法就是COOKIE共享,这个比较容易理解,由一个页面在客户端机器放置一个COOKIE文件,下一个页面访问的时候,直接读取这里面的值就OK了。

原文:http://www.jb51.net/article/23425.htm


推荐阅读
  • Imtryingtofigureoutawaytogeneratetorrentfilesfromabucket,usingtheAWSSDKforGo.我正 ... [详细]
  • 这是原文链接:sendingformdata许多情况下,我们使用表单发送数据到服务器。服务器处理数据并返回响应给用户。这看起来很简单,但是 ... [详细]
  • 本文介绍了Swing组件的用法,重点讲解了图标接口的定义和创建方法。图标接口用来将图标与各种组件相关联,可以是简单的绘画或使用磁盘上的GIF格式图像。文章详细介绍了图标接口的属性和绘制方法,并给出了一个菱形图标的实现示例。该示例可以配置图标的尺寸、颜色和填充状态。 ... [详细]
  • JavaScript和HTML之间的交互是经由过程事宜完成的。事宜:文档或浏览器窗口中发作的一些特定的交互霎时。能够运用侦听器(或处置惩罚递次来预订事宜),以便事宜发作时实行相应的 ... [详细]
  • CSS3选择器的使用方法详解,提高Web开发效率和精准度
    本文详细介绍了CSS3新增的选择器方法,包括属性选择器的使用。通过CSS3选择器,可以提高Web开发的效率和精准度,使得查找元素更加方便和快捷。同时,本文还对属性选择器的各种用法进行了详细解释,并给出了相应的代码示例。通过学习本文,读者可以更好地掌握CSS3选择器的使用方法,提升自己的Web开发能力。 ... [详细]
  • 本文主要解析了Open judge C16H问题中涉及到的Magical Balls的快速幂和逆元算法,并给出了问题的解析和解决方法。详细介绍了问题的背景和规则,并给出了相应的算法解析和实现步骤。通过本文的解析,读者可以更好地理解和解决Open judge C16H问题中的Magical Balls部分。 ... [详细]
  • ZSI.generate.Wsdl2PythonError: unsupported local simpleType restriction ... [详细]
  • 拥抱Android Design Support Library新变化(导航视图、悬浮ActionBar)
    转载请注明明桑AndroidAndroid5.0Loollipop作为Android最重要的版本之一,为我们带来了全新的界面风格和设计语言。看起来很受欢迎࿰ ... [详细]
  • 也就是|小窗_卷积的特征提取与参数计算
    篇首语:本文由编程笔记#小编为大家整理,主要介绍了卷积的特征提取与参数计算相关的知识,希望对你有一定的参考价值。Dense和Conv2D根本区别在于,Den ... [详细]
  • 本文介绍了南邮ctf-web的writeup,包括签到题和md5 collision。在CTF比赛和渗透测试中,可以通过查看源代码、代码注释、页面隐藏元素、超链接和HTTP响应头部来寻找flag或提示信息。利用PHP弱类型,可以发现md5('QNKCDZO')='0e830400451993494058024219903391'和md5('240610708')='0e462097431906509019562988736854'。 ... [详细]
  • 本文介绍了一个题目的解法,通过二分答案来解决问题,但困难在于如何进行检查。文章提供了一种逃逸方式,通过移动最慢的宿管来锁门时跑到更居中的位置,从而使所有合格的寝室都居中。文章还提到可以分开判断两边的情况,并使用前缀和的方式来求出在任意时刻能够到达宿管即将锁门的寝室的人数。最后,文章提到可以改成O(n)的直接枚举来解决问题。 ... [详细]
  • web.py开发web 第八章 Formalchemy 服务端验证方法
    本文介绍了在web.py开发中使用Formalchemy进行服务端表单数据验证的方法。以User表单为例,详细说明了对各字段的验证要求,包括必填、长度限制、唯一性等。同时介绍了如何自定义验证方法来实现验证唯一性和两个密码是否相等的功能。该文提供了相关代码示例。 ... [详细]
  • Ihavethefollowingonhtml我在html上有以下内容<html><head><scriptsrc..3003_Tes ... [详细]
  • 如何在HTML中获取鼠标的当前位置
    本文介绍了在HTML中获取鼠标当前位置的三种方法,分别是相对于屏幕的位置、相对于窗口的位置以及考虑了页面滚动因素的位置。通过这些方法可以准确获取鼠标的坐标信息。 ... [详细]
  • 本文介绍了pack布局管理器在Perl/Tk中的使用方法及注意事项。通过调用pack()方法,可以控制部件在显示窗口中的位置和大小。同时,本文还提到了在使用pack布局管理器时,应注意将部件分组以便在水平和垂直方向上进行堆放。此外,还介绍了使用Frame部件或Toplevel部件来组织部件在窗口内的方法。最后,本文强调了在使用pack布局管理器时,应避免在中间切换到grid布局管理器,以免造成混乱。 ... [详细]
author-avatar
lingling2502852417
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有