美文网首页
利用localStorage保存文章详情页已读位置

利用localStorage保存文章详情页已读位置

作者: SherryWu7 | 来源:发表于2017-09-28 10:24 被阅读0次

    保存当前阅读位置

    saveScrollTop: function (key, param) {
          var flag = false;
          var scrollTopList = Utils.getCache(key);  // 获取已经保存过的scrollTopList
          var data = [];
          if (!scrollTopList) {   // 没有存储记录
            data.push(param);
            Utils.saveCache(key, data);
          } else {
            for (var i = 0; i < scrollTopList.length; i++) {    // 循环已有的scrollTopList
              if (scrollTopList[i].classId === param.classId) {  // 查出相同文章ID的记录并更新它的scrollTop值
                scrollTopList[i].top = param.top;
                flag = true;
                break;
              }
            }
            if (!flag) {  // 在scrollTopList中没有相关记录的Id,把接收到的param push到scrollTopList中
              scrollTopList.push(param);
            }
            Utils.saveCache(key, scrollTopList);   // 保存
          }
        },
    
    

    在退出详情页时保存当前scrollTop

    var param = {
      classId: 123,  // 当前文章id
      top: 640    // 当前文章的scrollTop
    };
    saveScrollTop('courseScrollTop', param);
    

    获取阅读详情位置

    getScrollTop: function (key, classId) {
          var scrollTopList = Utils.getCache(key);
          var scrollTop = 0;
          if (!scrollTopList) {
            return;
          }
          for (var i = 0; i < scrollTopList.length; i++) {   // 循环已有的scrollTopList 
            if (scrollTopList[i].classId === classId) {  // 查出相同文章ID的记录并获取到它的scrollTop值
              scrollTop = scrollTopList[i].top;
              // $$(element).scrollTop(scrollTopList[i].top);
              break;
            }
          }
          return scrollTop;
        },
    
    

    在进入详情页时获取当前scrollTop

    var scrollTop = getScrollTop('courseScrollTop', classId);
    $('#detail').scrollTop(scrollTop);
    

    注意

    在进入页面设置文章的scrollTop时,要确保页面的图片等已经加载显示,不然设置的scrollTop会不准确~

    相关文章

      网友评论

          本文标题:利用localStorage保存文章详情页已读位置

          本文链接:https://www.haomeiwen.com/subject/zukmextx.html