js中url跳转问题
问题描述:列表中有不同的企业名字,每个企业名字都有一个不同的链接,用id做为参数区分。点击不同的名字,根据id的不同跳转到对应的详情页,设置连接如下:
1. url = http://localhost:3000/test#/detail?id="123456"
2. url = http://localhost:3000/test#/detail?id="456789"
两个链接除了参数id的值不同其他的都是相同的,这样看来通过window.location.href = url;应该是能够实现跳转了吧(前提:id是真是有效的)。但是真是运行起来后发现并不像我们想象的那样正常,第一个链接跳转了,第二个链接不跳转了。
问题原因:后来通过各种折腾,终于找出原因;因为第一次正常跳转,页面地址变成 http://localhost:3000/test#/detail?id="" ,第二次要跳转http://localhost:3000/test#/detail?id=""的时候,浏览器页面没有刷新跳转,由于浏览器是以锚点(“#”)为界限,判断当前页面链接和将要跳转的链接的锚点以前的地址是否一致,如果一致则不刷新页面,如果不一致则刷新。这里因为我们除了id不同其余的都一样,所以浏览器是有更新链接的,只是页面没有实现跳转,页面没有得到刷新。
解决办法:将跳转链接更改为 http://localhost:3000/test?id="456789"#/detail 其实就是把锚点(#/detail),放到最后面,这样,锚点以前的内容就会根据id的不同而显得不一样了,这样浏览器就会为我们刷新并跳转页面了
一、iframe中几种跳转方式:
- 当前窗口(当前iframe跳转)
- window.location.href = url;
- location.href = url;
- self.location.href = url;
js中url跳转问题的更多相关文章
- HTML+JS中网页跳转的写法
1.html中使用meta中跳转,通过meta可以设置跳转时间和页面 <head> <!--只是刷新不跳转到其他页面 --> <meta http-equiv=" ...
- JS中URL编码参数(UrlEncode)
JS中URL编码参数(UrlEncode) 网上有很多文字作品写涉及在JS中呈现类似UrlEncode功能时都是自定义参数来呈现,其实JS中本身就有那样的参数.参数parameter由于用类似URL的 ...
- 用 js 做 URL 跳转带来的 Referer 丢失问题.
http 302 重定向是可以保持 referer 的.例:在 A 页面上提交登录表单到 B,B 返回一个重定向页面到 C,在 C 处理里面检查 Referer 可知道它的来源是 A 而不是 B. 但 ...
- 程序ajax请求公共组件app-jquery-http.js中url参数部分的项目应用
结合微信登录以及微信支付的案例:= =||| (案例比较奇葩复杂) 简述项目流程: 1.获取用于公众号支付的openid(公众平台):在微信内置浏览器中打开网页链接,刚进入页面就通过微信公众平台获取该 ...
- Node.js中url的详解
var url = require('url');var str = 'http://zhufengnodejs:123@github.com:80/2016jsnode?name=zfpx& ...
- js中页面跳转几种方法
<script> function toLogin(){ //第一种 //self.location="/zhld/toTestLogin"; //第二种 top.lo ...
- js中url解码
var name = window.location.search.substr(4,30);//name = decodeURI(name);//使用示例document.getElementByI ...
- js中页面跳转(href)中文参数传输方式
编码: escape(参数); 解码: unescape(参数);
- js中url有中文的转码方法
转载:https://www.cnblogs.com/chiangfai/p/6073000.html
随机推荐
- 低版本IE内核浏览器兼容placeholder属性解决办法
最简便的一个方法,通过js实现. <input type="text" name="username" id="username" v ...
- ps删除或覆盖内容
除了选区删除.复制选区内容覆盖之外另外一种方法. 删掉字母"PS": 1. 矩形框选工具在字母上方画出选区 2. Ctrl+T,并拖拽底部以覆盖字母 3. 完成
- Filezilla Server日志文件
Filezilla Server版本:0.9.41. Filezilla Server日志文件在软件安装目录下Logs目录下. 但Filezilla Server默认不开始日志记录,如何开启filez ...
- 提高SQL查询效率
1.对查询进行优化,应尽量避免全表扫描,首先应考虑在 where 及 order by 涉及的列上建立索引. 2.应尽量避免在 where 子句中对字段进行 null 值判断,否则将导致引擎放弃使用索 ...
- VSCode插件MSSQL教程(昨天提了一下)
推荐一个跨平台SQL IDE:https://docs.microsoft.com/zh-cn/sql/sql-operations-studio/download 什么数据库都木有(系统自带的不算) ...
- echarts legend 重叠 (转载)
解决方案: 1. 调整option中的grid.top值才能避免重叠:(可以设置定制,也可以定义了一个计算公式) 2. 文档注明[特殊字符串 ''(空字符串)或者 '\n' (换行字符串)用于图例的 ...
- 小技巧:selenium java中如何使用chrome默认的profile
使用浏览器默认的profile可以在一定程度上实现免登录的效果,另外默认的profile中很多文件都被缓存了,也有利于加快测试的速度 System.setProperty("webdrive ...
- 树莓派系列教程:1.环境与系统,无显示器无键盘无网线联网并使用PuTTy与VNC图形界面远程登录
本文所需物品清单: Raspberry Pi 3 Model B 主板.SD卡与读卡器(用于烧录系统) 资料整理来源在文尾 需要下载的资源与工具: 推荐系统-Raspbian 树莓派官方深度定制的硬件 ...
- hdu 2045 递推
从n>=4开始考虑,只考虑n-1和1的颜色是否相等情况.推出公式F(n)=F(n-1)+2*F(n-2) AC代码: #include<cstdio> const int maxn= ...
- MongoDB,子查询
//1.从sub(订单明细)对订单号分组,查询最多子订单的单号一条数据,重命名orderNo字段为num//2.根据这个sub.num(从结果集里获取第一条结果),查询main(主档表) db.mai ...