近期作了一个移动端项目,首页为信息流列表,在检测过程当中,微信端进入详细页,返回到信息流页面,每次数据从新加载,不能定位到最后一次点击的信息位置,严重影响体验。html
针对这个问题,百般询问度娘,终于解决,已分享给你们,共勉。jquery
主要运用知识点:ajax
window.sessionStorage.setItem()缓存
window.sessionStorage.getItem()微信
window.sessionStorage.removeItem()session
解决步骤:dom
<script src="js/jquery.js"></script>添加到页面异步
一、本地存储 window.sessionStorage.setItemhtm
首先是ajax异步加载,每次滚动到底部就加载信息,这个不关键,为了减小监听次数,咱们能够为每条信息的a连接添加监听事件,即连接触发时,将加载的全部信息,缓存到本地
newBox.on('click', 'a', function() {
var html = newBox.html();
var session = {html : html};
var str = JSON.stringify(session);
window.sessionStorage.setItem('pageCont', str);
});事件
二、页面返回 window.sessionStorage.getItem
获取存储带本地的全部信息
var str = window.sessionStorage.getItem('pageCont');
var obj = JSON.parse(str);
var html = obj.html;
newBox.html(html); // 渲染dom元素
三、移除本地存储 window.sessionStorage.removeItem
渲染信息后移除以便清除空间留着下次再用;
window.sessionStorage.removeItem('pageCont');
就用这三步就搞定了,你们试试吧。原创文章,转发请标注出处,若有问题,请指教,你们共同进步。