怎么在新頁面中返回到前一頁瀏覽的歷史位置？

、第一步：需要注意引入的js
jquery.js
jquery.cookie.js

下載地址鏈接：https://pan.baidu.com/s/1jJYfAnW 密碼：8fan

 

a頁面 ---》 b頁面 
b頁面返回 ———— 》 a頁面


第二部：在被返回的前一頁加入以下代碼
//這個方法是當頁面返回來的時候從cookies中拿到值，並且返回到上次瀏覽到額位置
<script type="text/javascript">   
   $(function () {
        var str = window.location.href;
        str = str.substring(str.lastIndexOf("/") + 1);
        if ($.cookie(str)) {
            $("html,body").animate({ scrollTop: $.cookie(str) }, 1000);//滾動到cookies中去出的值（就是下邊我存到cookies中的值）
        }else {
        }
    })
    
  //這個是存儲cookies的值，監聽頁面滾動事件，看看我當前滾動條滾動到哪里了
    $(window).scroll(function () {
        var str = window.location.href;
        str = str.substring(str.lastIndexOf("/") + 1);
        var top = $(document).scrollTop();//監聽當前頁面的滾動調的位子
        $.cookie(str, top, { path: '/' });//存到cookies中
        return $.cookie(str); //最后一行這個可以去掉。網上有寫的，不太明白。去掉也沒問題（項目親測），如果不行加上自己實驗
    })
</script>

這個是我的頁面，應為是好幾塊，左右，上下所以監聽的時候就不能監聽全部的html,body了，主要監控的是滾動條所在的頁面，主要是監聽滾動條我滾動位置

這個是body的部分，明顯沒有滾動條

這個是html的部分，也不是

這個div才是我需要的監控控件。

所以寫的時候需要改動

<script type="text/javascript">  
    $(function() {
        var str = window.location.href;
        str = str.substring(str.lastIndexOf("/") + 1);
        var topp = $.cookie(str);
        if (topp != null) {
            $("#cateNav").animate({ scrollTop: topp }, 100);
        }
        else {
        }
    });
    
    $("#cateNav").scroll(function () {
        
        var str = window.location.href;
        str = str.substring(str.lastIndexOf("/") + 1);
        var top = $("#cateNav").scrollTop();
        $.cookie(str, top, { path: '/' });
        //return $.cookie(str);
    }) 
</script>

這里我監聽的控件不一樣。監聽控件的時候需要自己看自己需要的頁面的滾動條在那個容器里邊。