返回信息流页面重新加载问题

melody_lql 发布于2019-08-01 16:53 / 833人阅读

摘要：近期做了一个移动端项目，首页为信息流列表，在检测过程中，微信端进入详细页，返回到信息流页面，每次数据重新加载，不能定位到最后一次点击的信息位置，严重影响体验。原创文章，转发请标注出处，如有问题，请指教，大家共同进步。

　　近期做了一个移动端项目，首页为信息流列表，在检测过程中，微信端进入详细页，返回到信息流页面，每次数据重新加载，不能定位到最后一次点击的信息位置，严重影响体验。

　　针对这个问题，百般询问度娘，终于解决，已分享给大家，共勉。

主要运用知识点：

window.sessionStorage.setItem()

window.sessionStorage.getItem()

window.sessionStorage.removeItem()

解决步骤：

添加到页面

1、本地存储 window.sessionStorage.setItem

首先是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);
});

2、页面返回 window.sessionStorage.getItem

获取存储带本地的所有信息
var str = window.sessionStorage.getItem("pageCont");
var obj = JSON.parse(str);
var html = obj.html;
newBox.html(html); // 渲染dom元素

3、移除本地存储 window.sessionStorage.removeItem

渲染信息后移除以便清除空间留着下次再用;

window.sessionStorage.removeItem("pageCont");

就用这三步就搞定了，大家试试吧。
原创文章，转发请标注出处，如有问题，请指教，大家共同进步。

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/50806.html

返回信息流页面重新加载问题

摘要：近期做了一个移动端项目，首页为信息流列表，在检测过程中，微信端进入详细页，返回到信息流页面，每次数据重新加载，不能定位到最后一次点击的信息位置，严重影响体验。原创文章，转发请标注出处，如有问题，请指教，大家共同进步。　　近期做了一个移动端项目，首页为信息流列表，在检测过程中，微信端进入详细页，返回到信息流页面，每次数据重新加载，不能定位到最后一次点击的信息位置，严重影响体验。　　针...

luck 2019-08-29 12:38 评论0 收藏0
返回信息流页面重新加载问题

摘要：近期做了一个移动端项目，首页为信息流列表，在检测过程中，微信端进入详细页，返回到信息流页面，每次数据重新加载，不能定位到最后一次点击的信息位置，严重影响体验。原创文章，转发请标注出处，如有问题，请指教，大家共同进步。　　近期做了一个移动端项目，首页为信息流列表，在检测过程中，微信端进入详细页，返回到信息流页面，每次数据重新加载，不能定位到最后一次点击的信息位置，严重影响体验。　　针...

HackerShell 2019-08-20 16:49 评论0 收藏0
你不知道的浏览器页面渲染机制

摘要：前言浏览器的内核是指支持浏览器运行的最核心的程序，分为两个部分的，一是渲染引擎，另一个是引擎。渲染引擎在不同的浏览器中也不是都相同的。接下来就是浏览器的渲染过程。布局完成后，浏览器会立即发出和事件，将渲染树转换成屏幕上的像素。前言浏览器的内核是指支持浏览器运行的最核心的程序，分为两个部分的，一是渲染引擎，另一个是JS引擎。渲染引擎在不同的浏览器中也不是都相同的。目前市面上常见的浏览...

zhunjiee 2019-08-23 16:50 评论0 收藏0
你不知道的浏览器页面渲染机制

摘要：前言浏览器的内核是指支持浏览器运行的最核心的程序，分为两个部分的，一是渲染引擎，另一个是引擎。渲染引擎在不同的浏览器中也不是都相同的。接下来就是浏览器的渲染过程。布局完成后，浏览器会立即发出和事件，将渲染树转换成屏幕上的像素。前言浏览器的内核是指支持浏览器运行的最核心的程序，分为两个部分的，一是渲染引擎，另一个是JS引擎。渲染引擎在不同的浏览器中也不是都相同的。目前市面上常见的浏览...

aboutU 2019-08-19 11:36 评论0 收藏0