JS可不可以实现:改变地址栏地址而不跳转
来源:互联网 发布:网络vx是什么意思 编辑:程序博客网 时间:2024/05/01 21:00
比如:我点击页面上的一个按钮,网址栏中的地址发生改变,但是页面不跳转也不刷新,但是我手动刷新此页面的时候,实际要刷新地址栏中的新地址 其实html5早就帮我们解决了 用history.pushState 详情: https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history
pushState方法
pushState()有三个参数:state对象,标题(现在是被忽略,未作处理),URL(可选)。具体细节:
· state对象 –state对象是一个JavaScript对象,它关系到由pushState()方法创建出来的新的history实体。用以存储关于你所要插入到历史 记录的条目的相关信息。State对象可以是任何Json字符串。因为firefox会使用用户的硬盘来存取state对象,这个对象的最大存储空间为640k。如果大于这个数 值,则pushState()方法会抛出一个异常。如果确实需要更多的空间来存储,请使用本地存储。
· title—firefox现在回忽略这个参数,虽然它可能将来会被使用上。而现在最安全的使用方式是传一个空字符串,以防止将来的修改。或者可以传一个简短的标题来表示state
· URL—这个参数用来传递新的history实体的URL,注意浏览器将不会在调用pushState()方法后加载这个URL。但也许会过一会尝试加载这个URL。比如在用户重启了浏览器后,新的url可以不是绝对路径。如果是相对路径,那么它会相对于现有的url。新的url必须和现有的url同域,否则pushState()将抛出异常。这个参数是选填的,如果为空,则会被置为document当前的url。
某种意义上来说,调用pushState()方法很像设置了window.location = “#foo”,这两者都会创建和激活另一个关联到当前document的history实体,但pushState()另外有一些优点:
l 新的url可以是任何和当前url同域的url,相比之下,如果只设置hash,window.location会保持在同一个document。
l 如果不需要,你可以不修改url。对比而言,设置window.location = “#foo”;仅产生新的history实体,如果你当前的hash不是#foo
l 你可以将任意的数据与你的新history实体关联。使用基于hash的方法,需要将所有相关的数据编码为一个短字符串。
注意,pushState()方法不会使hashchange时间发生,即使是新旧url只是hash不同。
如浏览器地址为http://localhost:8080/tts6/user/teachertts6?pMUploadHomework=success 改变为http://localhost:8080/tts6/user/teachertts6 不用请求后台,直接改变url地址,怎么办了?很简单一句话//window.location为http://localhost:8080/tts6/user/teachertts6?pMUploadHomework=success
var state = {title:'',url:window.location.href.split("?")[0]};
history.pushState(state,'','teachertts6');
//现在浏览器的地址变为http://localhost:8080/tts6/user/teachertts6
- JS可不可以实现:改变地址栏地址而不跳转
- Ext不改变地址栏跳转页面
- Struts2 输入域名跳转到首页(不改变浏览器地址栏地址)
- js动态改变地址栏url,不刷新页面
- JS巧妙实现多级菜单中当前菜单不随页面跳转样式而发生变化
- JS实现页面跳转 浏览器地址栏保持不变
- js跳转到锚点(地址栏无“#”)
- js跳转到锚点(地址栏无“#”)
- web项目报错,跳转到指定页面,并且实现地址栏的改变
- JS获得当前地址栏地址
- JS获取地址栏的地址
- 不刷新页面改变浏览器地址栏
- 重定向地址栏信息不改变
- 【讨论思考】可不可以不用pointer而实现一个linked list?
- history.pushState()实现不跳转,改变路由异步刷新
- 【vue.js】子组件的参数值不随着父组件值的改变而改变
- JS页面跳转使地址后面不显示参数
- JS页面跳转使地址后面不显示参数
- windows 键盘消息的机制
- 批改HTML文件的简单程序之经验总结
- mysql中select count()效率简析
- 获得系统中某个进程的cpu使用率
- Archie OSG Step By Step③ OSG+VS2010+MFC单文档程序框架构建
- JS可不可以实现:改变地址栏地址而不跳转
- linux下24时区文件对于表
- rdlc 报表第二页没有表头处理
- syntax error near unexpected token 和 Linux Shell syntax error: unexpected end of file
- SOJ 2163: Lost Cows
- 关于launch failed, binary not found
- 转载:EXTJS4 新特性之Ext.data.Model
- stardict词典安装
- Asterisk Manager Interface(AMI)