使用sessionstorage解决微信网页返回保留原状态的问题

最新推荐文章于 2024-09-19 08:45:00 发布

SaberMiku

最新推荐文章于 2024-09-19 08:45:00 发布

阅读量1.3w

点赞数

本文链接：https://blog.csdn.net/zhukeqin1/article/details/53542653

版权

之前做一个项目，关于微信方面的，遇到了需要返回保留原状态的问题，卡了一段时间，最后用sessionstorage解决了问题，赶紧来做个笔记。

做的是商城相关的，整个页面都是用ajax动态生成的，微信在返回上一页的时候并不是真正的返回，而是相当于location.herf，这就造成了极大的不便，使得数据又要从服务器端获取，这样就会回到顶部的位置（不仅是微信，绝大部分webview的浏览器都是这个套路），既然这个相当于location.herf的返回不能改变，那么就只能从别的方向上去解决这个问题了。

sessionstorage是html5中新添加的属性，跟localstorage使用的是同一套api。sessionstorage与他的兄弟不一样的是这个家伙在关闭浏览器的同时自动清除，满足我的需求。

基本思路就是在点击商品时使用sessionstorage记录滚动条距离div顶部的距离，然后在返回时加载页面时检测是否有值记录，有就向下滚动到一定距离

由于我参与的商城项目应用的是无限向下滚动，除了记录高度之外还要记录需要加载的页数即总商品数。部分代码如下：

window.οnlοad=function(){
		if(sessionStorage.getItem("h")){
			console.log(sessionStorage.h);
			$('.content').scrollTop(sessionStorage.h);
			var h = $('.content').scrollTop();
			if(h == sessionStorage.h)  sessionStorage.h=0;
			}
	}