1.如果上一页是静态页面,可以用 history.go(-1)方法;

go() 方法可加载历史列表中的某个具体的页面。

该参数可以是数字,使用的是要访问的 URL 在 History 的 URL 列表中的相对位置。(-1上一个页面,1前进一个页面)。或一个字符串,字符串必须是局部或完整的URL,该函数会去匹配字符串的第一个URL。

该方法返回上一页,不刷新页面,但是会执行js;

例子:

Back

点击back 页面就会返回上一个页面的浏览位置

2.我在工作中遇到的,页面采用了vue,页面每次加载都会去请求数据,用history.go(-1)方法返回上一页,上一页的页面因为重新请求数据,页面不会定位到上次浏览的位置;

解决思路:使用onbeforeunload(事件在即将离开当前页面(刷新或关闭)时触发)方法在页面离开时把滚动条位置和页面文本高度放到cookie中,当页面刷新或重新加载时取出滚动条位置和页面文本高度,设置到页面。

代码如下:

window.onbeforeunload = function () {

var scrollPos, height;

if (typeof window.pageYOffset != 'undefined') {

scrollPos = window.pageYOffset;

} else if (typeof document.compatMode != 'undefined' &&

document.compatMode != 'BackCompat') {

scrollPos = document.documentElement.scrollTop;

} else if (typeof document.body != 'undefined') {

scrollPos = document.body.scrollTop;

}

height = document.body.scrollHeight;

document.cookie = "scrollTop=" + scrollPos; //存储滚动条位置到cookies中

document.cookie = "height=" + height; //存储滚动条位置到cookies中

}

new Vue({

el:'#app',

updated: function () {

var height;

//获取之前的页面高度

if (document.cookie.match(/height=([^;]+)(;|$)/) != null) {

var arr = document.cookie.match(/height=([^;]+)(;|$)/); //cookies中不为空,则读取页面高度

height = parseInt(arr[1]);

}

//获取之前的滚动条位置

if (document.body.scrollHeight == height) {

if (document.cookie.match(/scrollTop=([^;]+)(;|$)/) != null) {

var arr = document.cookie.match(/scrollTop=([^;]+)(;|$)/); //cookies中不为空,则读取滚动条位置

document.documentElement.scrollTop = parseInt(arr[1]);

document.body.scrollTop = parseInt(arr[1]);

}

}

}

})

Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐