在使用html5开发app的时候,往往会遇到条件查询的情况。在这个情况下,用户反复查询一个输出中的所有参数。最简单的方式恐怕就是修改url链接了,但是其url链接一旦修改,之前查询的记录就会被存储到history中去。这样,用户如果使用返回键,往往不会返回到之前的页面,而是返回到上一次查询的结果,但是这样的结果对用户体验非常不好。
下面我就来教大家一种即使跳转了,也不会对将当前页记录到histoy的方法。
这里主要用到了两个函数,一个是window.history.replaceState,另一个是window.location.reload。其中window.location.reload这个函数大家应该很熟悉,是一个刷新页面的函数,由于只是刷新页面,因此不会记录在history中。但是一定会有人问,既然只是刷新页面,为什么会跳转到新页面去呢?
这就涉及到今天要讲的重点函数window.history.replaceState了,这个函数的功能是在页面不发生跳转的情况下,修改页面的url与title,具体使用方法为:
history.replaceState(null, "页面标题", "xxx.html");
下面我举一个详细一点的例子:
测试页面5s后变化title与url
通过这种方式跳转,当前页面就不会记录到历史中去。