因为对代码里面的相对路径有点晕,每次使用window.location.href进行页面跳转的时候,每次都要测试一下,看看这样子写到底跳转到哪里去了。今天又碰到了,想到每次都要试,不如这次试个全的,以后都不用试了。就琢磨了下,这里做个记录。
说明:
1、项目名称:TestWeb;
2、首页:index.jsp,在webRoot根目录下
3、webRoot/page目录下,有test.jsp和test2.jsp
4、webRoot/page2目录下,有test.jsp
当前页面所处路径:http://127.0.0.1:8080/TestWeb/index.jsp,即首页。
情况1:从首页跳转到其他目录下,即从index.jsp跳转到page/test.jsp页面
代码:window.location.href='page/test.jsp'。page前面没有/,若是添加/就变成http://127.0.0.1:8080/page/test.jsp,出现404错误。
情况2:从其他目录跳转到首页,即从page/test.jsp跳转到index.jsp页面
代码:window.location.href='../index.jsp'。..表示上一级,当前页面在page下,向上一级就是webRoot也就是index.jsp所在目录了。
(PS:原本以为这样子写地址栏会这样子:http://127.0.0.1:8080/test/page/../index.jsp,没想到还挺智能的嘛知道..表示的是上一级目录。哈哈哈,涨姿势了。)
这里有两个情况需要说明:
a、若直接使用window.location.href='index.jsp',那么地址栏会变成http://127.0.0.1:8080/TestWeb/page/index.jsp,而index.jsp是在webRoot下而不是当前目录的page下,所以会出现404错误。
b、index.jsp前面不能有/,若是添加/就变成http://127.0.0.1:8080/index.jsp,也就是tomcat的首页了。
情况3:从其他目录跳转到同目录的另一个页面,即从page/test.jsp跳转到page/test2.jsp页面
这个也比较简单,因为在同一个目录下直接跳就好:window.location.href='test2.jsp'
情况4:从其他目录跳转到另一个目录的一个页面,即从page/test.jsp跳转到page2/test.jsp页面
根据情况2中的原理:先定位到上一级也就是webRoot下,再根据情况1的原理直接跳转,因此代码为:window.location.href='../page2/test2.jsp'
根据上面的四种情况总结出几个点:
1、使用window.location.href跳转到的路径一定不能加/,加了/就跳到tomcat目录而不是项目的目录了。
2、需要跳转时,先定位当前页面所在路径,然后通过..定位到webRoot下,最后定位到指定目录。或者先通过../定位到同目录下然后定位到指定目录。
相关推荐
window.location.href页面跳转的用法(区别于redirect)
一、location.href常见的几种形式 self.location.href;//当前页面打开URL页面 [removed].href;//当前页面打开URL页面 this.location.href;//当前页面打开URL页面 location.href;// 当前页面打开URL页面 parent....
“[removed].href”、”location.href”是本页面跳转 “parent.location.href”是上一层页面跳转 “top.location.href”是最外层的页面跳转 举例说明: 如果A,B,C,D都是jsp,D是C的iframe,C是B的iframe,B是A的...
javascript 打开页面window.location和window.open的区别.docx
详解js location.href和window.open的几种用法和区别.docx
NULL 博文链接:https://hugang357.iteye.com/blog/1833003
window.opener.location.href = window.opener.location.href 刷新以winodw.showModelDialog()方法打开的窗口 window.parent.dialogArguments.document.execCommand('Refresh'); 或 Response.Write("<script>...
简单的说:几种location.href的区别 js实现网页被iframe框架功能 “[removed].href”、”location.href”、”self.location.href”是本页面跳转 “parent.location.href”是上一层页面跳转 “top.location.href”是...
window.clearInterval与window.setInterval的用法.
window.location.href location.search; //获取url中"?"符后的字串 document.referrer 获取来路的url,相当于php的$_SERVER['HTTP_REFERER']。 encodeURIComponent() 对url进行转定义,相当于php的urlencode()...
document 表示的是一个文档对象,windows 表示一个窗口对象。... 发现,这两个的值不一样, document.URL : //www.jb51.net/ windows.location.href ://www.jb51.net/#server 所以,如果要用 fragment 进行
window.showModalDialog以及window.open用法简介
对window.open进行封装, 使其更好用, 且更兼容, 很多人说window.open不兼容,其实不是, 因为不能直接执行, 必须通过用户手动触发才行;看代码: 代码如下 var openWindow = function(url, options) { var str = ""; ...
window.postMessage的功能是允许程序员跨域在两个窗口/frames间发送数据信息。基本上,它就像是跨域的AJAX,但不是浏览器跟服务器之间交互,而是在两个客户端之间通信。让我们来看一下window.postMessage是如何工作...
windows.open这个是JavaScript函数,但是在应用起来的时候总会遇到比较多的麻烦,因为参数非常多,用法也非常的多
NULL 博文链接:https://shawnfree.iteye.com/blog/598885
window.hlp window.hlpwindow.hlp window.hlp window.hlp
今天总结一下js中几个对象的区别和用法: 首先来说说 parent.window与top.window的用法 “[removed].href”、”location.href”是本页面跳转 “parent.location.href”是上一层页面跳转 “top.location.href”是最...