Remember the last post I read

时间:2015-11-07 作者:Gjermund Dahl

我目前正在与WP一起出版一系列书籍(不是英文)。书籍、章节和子部分的排列方式如下:每本书(类别)分为章节(子类别),而章节(子类别)又分为子部分(帖子)。该网站完全开放,无需用户帐户/登录。注释使用disqs插件进行管理。

是否有任何方法可以创建/更新带有导航信息的cookie,以便读者在第二天离开并返回时,站点自动导航到最后一篇文章?

编辑:

MS Word 2013实现了类似的功能。打开一个大文档时,会出现一个信息框“欢迎回来,从您离开的地方开始”这对一个忠实的读者来说是一个很好的欢迎。

1 个回复
最合适的回答,由SO网友:Mark 整理而成

我喜欢这个问题,所以我自己看了看。我认为最好的方法是使用localstorage和jQuery来存储用户的当前URL和滚动位置。然后,您可以在他们返回该页面时运行检查,或者使用类似“继续阅读”的按钮,该按钮将检索URL和滚动位置,并将用户发送到该确切点。

JS公司

if(typeof(Storage) !== "undefined") {
检查是否支持本地存储

var storedResult = localStorage.getItem("location");
var storedURL = localStorage.getItem("url");
获取存储的URL和滚动位置

 if (storedURL !== \'undefined\' && storedResult !== null) {
检查URL是否存储在var currentUrl=窗口中。地方href;获取当前URL

     if (currentUrl != storedURL) {
检查当前URL和存储的URL是否不匹配。

将用户发送到存储的URL。您可能希望通过“继续阅读”按钮或其他方式触发此操作,否则您可能会将用户发送到他们不想去的地方。

}
    else if (storedResult !== \'undefined\' && storedResult !== null) {
elseif检查是否存储了窗口滚动位置。

        $(window).scrollTop(storedResult);
滚动到该位置。

}
 } 
    $(window).scroll(function () { 
滚动事件

    var scrolledDown = window.scrollY;
    var currentUrl = window.location.href;
获取窗口滚动药水和url

    localStorage.setItem("location", scrolledDown);
    localStorage.setItem("url", currentUrl);
存储在本地存储中。

});

 } else {

    //No Web Storage Support.
 }
全部加在一起

if(typeof(Storage) !== "undefined") {
//Check is local storage is supported

var storedResult = localStorage.getItem("location");
var storedURL = localStorage.getItem("url");
//Get the Stored URL and Scroll Location

 if (storedURL !== \'undefined\' && storedResult !== null) {
     //Check if the URL is stored
     var currentUrl = window.location.href;
     //Get the current URL
     if (currentUrl != storedURL) {
         //Check if the current URL and Stored URL Do Not match.

         // send user to stored URL. You would probably want to trigger this on a "continue reading" button or something otherwise you could end up sending users where they dont wish to go.
     }

    else if (storedResult !== \'undefined\' && storedResult !== null) {
        //elseif check if the window scroll location is stored.

        $(window).scrollTop(storedResult);
        //scroll to that location.
    }
 }

$(window).scroll(function () { 
    //On scroll event
    var scrolledDown = window.scrollY;
    var currentUrl = window.location.href;
    // get the window scroll potion and url
    localStorage.setItem("location", scrolledDown);
    localStorage.setItem("url", currentUrl);
    // store in local storage.
});

} else {
    // No Web Storage Support.
}
演示:https://jsfiddle.net/fg9uok4L/

资源jQuery。滚动顶部:http://api.jquery.com/scrollTop/jQuery。纸卷:http://api.jquery.com/scroll/本地存储:http://www.smashingmagazine.com/2010/10/local-storage-and-how-to-use-it/

性能不确定,未测试。

相关推荐

setcookies and header send

我在header.php 模板的如下所示:setcookie(\"test_time_\".$cookie_id.\"\", $cookies_times, time()+3600); 结果总是这样headers already sent, 我在插件内部使用这个插件,也在插件外部尝试,结果总是一样的。可以在标题中使用cookie,或者我可以做些什么来解决这个问题,我需要使用cookie来实现works little功能。