zoukankan      html  css  js  c++  java
  • javascript设置网页刷新或者重新加载后滚动条的位置不变

    有个同事说再javascript中你可以做任何你想做的事情,当时觉得不以为然,今天遇到个问题,就是页面重新加载后总是回到页面的顶部,如果客户只想看到他想看到的部分是怎么变化的,这个体验就好了。原本想象应该有页面设置scroll之类的,没有看到,在网上搜到一个方法就是在页面加载前用cookie记录滚动条的位置,加载之后从cookie中取回这个值再设置滚动条的位置,这个方法如此风骚。

    window.onbeforeunload = function(){
        var scrollPos;    
        if (typeof window.pageYOffset != 'undefined') {
            scrollPos = window.pageYOffset;
        }
        else if (typeof document.compatMode != 'undefined' &&
            document.compatMode != 'BackCompat') {
            scrollPos = document.documentElement.scrollTop;
        }
        else if (typeof document.body != 'undefined') {
            scrollPos = document.body.scrollTop;
        }
        document.cookie="scrollTop="+scrollPos; //存储滚动条位置到cookies中
    }
    
    window.onload = function()
    { 
        if(document.cookie.match(/scrollTop=([^;]+)(;|$)/)!=null){
            var arr=document.cookie.match(/scrollTop=([^;]+)(;|$)/); //cookies中不为空,则读取滚动条位置
            document.documentElement.scrollTop=parseInt(arr[1]);
            document.body.scrollTop=parseInt(arr[1]);
        }
    }
  • 相关阅读:
    我的友情链接
    我的友情链接
    我的友情链接
    我的友情链接
    我的友情链接
    我的友情链接
    我的友情链接
    以太坊:通信协议对象 shh
    以太坊:Truffle 概述
    以太坊:快速入门 Truffle
  • 原文地址:https://www.cnblogs.com/tylerdonet/p/3642636.html
Copyright © 2011-2022 走看看