最近做了些H5页面(文章页面),用户提了些常用的需求:返回上一页,停留在上次浏览的位置
搜索了些资料和抄抄前端妹子的代码,实现如下:
//返回上次浏览的位置
var sortId = $("#sortId").val(); //这篇文章的唯一标识id
var str = sortId + 'scrollTop';
////localStorage 方法存储的数据没有时间限制(从localStorage获取位置数据,类似于memcached)
var scrollTop = localStorage.getItem(str);
// alert(scrollTop);
if(scrollTop){
$('body').scrollTop(scrollTop);
}else{
$('body').scrollTop(0);
}
//保存浏览位置
$('body').on('touchmove', function(event) {
// event.preventDefault();
console.log($('body').scrollTop());
var scrollTop = $('body').scrollTop();
var sortId = $("#sortId").val();
var str = sortId + 'scrollTop';
localStorage.setItem(str,scrollTop); //存储位置数据
});
//已调通测试,将代码放入文章页面。