HTML5新api即pushState和replaceState实现无刷新修改url
1,首先我面临一个需求,页面回退时需要知道来之前的页面状态。很简单,回退时在url里赋参数即可。问题是在ipad上,回退按钮是安卓那边的,我控制不了。只好采用js无刷新修改url历史记录,来告诉服务器我回去时要给我保持神秘状态。
先上代码,再解释这两个api。
var url=window.location.href;
var length=url.length;
newur=url+"****";
history.replaceState(null, "",newurl);
2,HTML5新添加了两个api分别是pushState和replaceState,DOM中的window对象通过window.history方法提供了对浏览器历史记录的读取,可以在用户的访问记录中前进和后退,我们可以开始操作这个历史记录堆栈。真是极好的。
push是插入,replace是替换上一个url历史记录。
还发现pushState有一个好用处。Ajax+pushState可以实现翻页无刷新的动作。本来ajax就是无刷新局部请求页面了,但如果你想要保持一个正确的状态,来作返回的地址的话。你就要在每次ajax请求之后去pushState一个合适的地址到历史记录中。
(如有不准确的地方,欢迎指正)
HTML5新api即pushState和replaceState实现无刷新修改url的更多相关文章
- HTML5无刷新修改URL
HTML5新添加了两个api分别是pushState和replaceState,DOM中的window对象通过window.history方法提供了对浏览器历史记录的读取,可以在用户的访问记录中前进和 ...
- HTML5无刷新修改Url,history pushState/replaceState
一.认识window.history window.history表示window对象的历史记录,是由用户主动产生,并且接受javascript脚本控制的全局对象.window对象通过history对 ...
- HTML5实现无刷新修改URL
前言 今天在做一个vue的搜索功能,需要从搜索结果页面跳转到细节页面,然后点击返回还能返回到刚刚的结果页面,如果只用window.history.go(-1)当然会重新刷新搜索页面,当然是不行的. 我 ...
- history.pushState 实现浏览器页面不刷新修改url链接
最近遇到了在不刷新页面的情况下修改浏览器url链接的需求,遂求助于万能的度娘,最终通过history.pushState()完美解决问题.现在将我理解的一些内容分享一下,不对的地方欢迎大家指出. 在使 ...
- 通过history.pushState无刷新改变url
通过history.pushState无刷新改变url 背景 在浏览器中改变地址栏url,将会触发页面资源的重新加载,这使得我们可以在不同的页面间进行跳转,得以浏览不同的内容.但随着单页应用的增多,越 ...
- history.pushState无刷新改变url
通过history.pushState无刷新改变url 背景 在浏览器中改变地址栏url,将会触发页面资源的重新加载,这使得我们可以在不同的页面间进行跳转,得以浏览不同的内容.但随着单页应用的增多,越 ...
- [Web] HTML5新特性history pushState/replaceState解决浏览器刷新缓存
转载: https://www.jianshu.com/p/cf63a1fabc86 现实开发中,例如‘商品列表页’跳转‘商品详情页’,返回时,不重新加载刷新页面,并且滚动到原来的位置. 1.首先,先 ...
- H5,API的pushState(),replaceState()和popstate()用法
pushState和replaceState是H5的API中新添加的两个方法.通过window.history方法来对浏览器历史记录的读写. pushState和replaceState 在 HTML ...
- window.history.pushState与ajax实现无刷新更新页面url
ajax能无刷新更新数据,但是不能更新url HTML5的新API: window.history.pushState, window.history.replaceState 用户操作history ...
随机推荐
- SrpingCloud 之SrpingCloud config分布式配置中心实时刷新
默认情况下是不能及时获取变更的配置文件信息 Spring Cloud分布式配置中心可以采用手动或者自动刷新 1.手动需要人工调用接口 监控中心 2.消息总线实时通知 springbus 动态刷新 ...
- M1905
11.09 11:00------102万 11.09 14:00---103万 11.12 16:00------103万 11.19 16:00---94万 11.20 ...
- LinkedBlockingQueue,ArrayListBlockingQueue,SynchronousQueue
LinkedBlockingQueue :1.读写锁分开,性能较 ArrayListBlockingQueue 只有一把锁控制读写要高一些.2.无界队列,不会触发Reject异常,ArrayListB ...
- CSS缎带效果
1. [代码]ribbon.html <!DOCTYPE HTML><html><head><style type="text/css&qu ...
- cocos2d-x在android真机上设置帧率无效的问题
通过setAnimationInterval设置帧频时,发现在android下没有效果的 在Cocos2dxRenderer .java文件里面找到了onDrawFrame这个函数.里面有句注释 : ...
- PHP限制IP访问 只允许指定IP访问 允许*号通配符过滤IP
/** * 检测访问的ip是否为规定的允许的ip * Enter description here ... */ function check_ip(){ $ALLOWED_IP=array('192 ...
- linux系统配置之单一网卡配置多个不同网段IP(centos)
1.用root权限的用户登录CENTOS,进入network-scripts文件夹下(本步骤可以省略,与二步骤一起完成): shell命令:cd /ect/sysconfig/network-scri ...
- Vue2.0 探索之路——vuex入门教程和思考
Vuex是什么 首先对于vuex是什么,我先引用下官方的解释. Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可 ...
- 我对java的理解(一)——注解就是贴标签
在现实生活中,贴标签这种现象比比皆是.去超市,去商场,每个或者每类物品都会有它的标签,甚至在我们自己身上也会有标签,比如,程序猿.逗逼.单身狗.80/90后.屌丝……呵呵,太多了.有时候,我们也会戏谑 ...
- SQL语言方方面面
1 数据库和SQL 1.1 数据库 DB, DBMS DBMS的种类: 层次性数据库, 关系型数据库, 非关系型数据库 RDBMS, 关系数据库管理系统 1.2 数据库的结构 RDBMS常见的系统结构 ...