实验环境：vs2015 asp.net(C#)

主要原理：

1.在页面滚动时或点击按钮时将当前滚动条位置记录到cookie[pos]，

2.页面刷新或重载时查询cookie[pos]中的值是否存在，若存在根据该值给滚动条定位

.aspx文件

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test.aspx.cs" Inherits="test" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <link rel="stylesheet" href="bootstrap-3.3.7-dist/css/MyStyleSheet.css" />

</head>

<body onscroll="aa()">

    <form id="form1" runat="server">

        <div>

            <br />

            <br />

            <br />

            <br />

            <br />

            <br />

            <br />

            <br />

            <br />

            <br />

            <br />

            <br />

            <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="aa()" />

            <div style="height: 600px" runat="server">

            </div>

            <asp:Button ID="Button3" runat="server" Text="Button" OnClientClick="aa()" /> 
　　　　</div>
　　 </form> 
</body>
 </html>

js代码

注意点：若页面指定了DTD，即指定了DOCTYPE时，使用document.documentElement.scrollTop获取滚动条滚动高度，若页面没有DTD，即没指定DOCTYPE时，使用document.body.scrollTop获取滚动条高度。如果在页面制定了DTD时使用document.body.scrollTop则取值一直为0。

 <script>　　　　

         function getCookie(c_name) {

         //从cookie中获取滚动条距离顶端位置

             if (document.cookie.length > 0) {

                 var aCookie = document.cookie.split(";");

                 for (var i = 0; i < aCookie.length; i++) {

                     var aCrumb = aCookie[i].split("=");

                     if (aCrumb[0] == c_name) {

                         return unescape(aCrumb[1]);

                     }

                 }

             }

             return ""

         }

         function setCookie(c_name, value) {

         //给cookie赋值

             document.cookie = c_name + "=" + escape(value) + ";";

         }

         function aa() {

             //页面指定了DTD，即指定了DOCTYPE时，使用document.documentElement。

             //页面没有DTD，即没指定DOCTYPE时，使用document.body。

             setCookie("pos", document.documentElement.scrollTop)

         }

         function checkMe() {

 　　　　　　//给scrollTop赋值

             if (getCookie("pos") != "") {

                 document.documentElement.scrollTop = getCookie("pos") + "px"

             }

         }

         checkMe()

     </script>
 

JavaScript实现页面刷新滚动条位置不变（利用cookie）的更多相关文章

  1. js实现div滚动条在页面刷新 滚动条位置固定

    思想:1.通过div的onscroll事件记录滚动条的scrollTop值,设置到document.cookie 2.页面加载时再读取document.cookie的值,设置给div的scrollTo ...

  2. JavaScript禁用页面刷新

    JavaScript禁用页面刷新代码如下: //禁用F5刷新 document.onkeydown = function () { if (event.keyCode == 116) { event. ...

  3. JQuery实现页面刷新滚动条自动滚动到特定位置

    var cotentOffset = $('#6f').offset(); $('.info_box').animate({ scrollLeft: cotentOffset.left }, ); 原 ...

  4. 用Javascript获取页面元素的位置

    制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...

  5. asp.net IE 页面刷新固定位置

    MaintainScrollPositionOnPostback="true" 可能我们会经常遇到这种情况,当页面内容比较多的时候,当用户执行操作执行一次页面回送后,页面又重新从顶 ...

  6. html-javascript前端页面刷新重载的方法汇总

    记得我在兴安得力实习要转正的时候,我领导象征性的给我出了一套测试题目,里面就有js闭包和页面刷新等题目.今天把很久之前的测试题目之一,js页面刷新的方法以及页面自动刷新跳转和返回上一页和下一页等方法总 ...

  7. sharepoint 2010 页面刷新时滚动条位置保持不变 Controlling scrollbar position on postback

    sharepoint 2010 页面刷新时滚动条位置保持不变 Controlling scrollbar position on postback在sharepoint 2010中,如果当前页面的篇幅 ...

  8. asp.net页面刷新或者回发后DIV的滚动条位置不变！（转）

    源文件:http://www.cnblogs.com/nyth/archive/2011/06/10/2077868.html 当把数据放在div里面,然后给div设置Scroll显示,在页面刷新后或 ...

  9. JS刷新页面后滚动条的位置不变

    有时候,在网页中点击了页面中的按钮或是刷新了页面后,页面滚动条又 会回到顶部,想看后面的记录就又要拖动滚动条,或者要按翻页键,非常不方便,想在提交页面或者在页面刷新的时候仍然保持滚动条的位置不变,最好 ...

随机推荐

  1. as3.0 比较两个数组

    var arr1:Array=[1,2,3,4] var arr2:Array=[1,2,4,3] trace(arr1.join(",") == arr2.join(" ...

  2. MR汇聚工具步骤

    ---------------------------------MR汇聚工具步骤------------------------------------- 1.需要连上141服务器 用户:root ...

  3. hbase-数据恢复流程

    引用<https://blog.csdn.net/nigeaoaojiao/article/details/54909921> hlog介绍: hlog构建: 从图中可以看出,对于一个hl ...

  4. phpexcel 使用模板导出报表

    function exportExcel($list, $filename, $indexKey = array()){ require_once(getcwd() . '../../app/Libs ...

  5. 【aardio】]SQL创建、读写 excel

    import access; var db,err = access( "/test.xls" ) //文件不存在可自动创建 //创建表 if( ! db.existsTable( ...

  6. 【aardio】如何对listview中某一列，某一行的特定值进行修改？

    用表格创建数组来实现. import win.ui; /*DSG{{*/ var winform = ..win.form( bottom=399;parent=...;right=599;text= ...

  7. DataTables warning : Requested unknown parameter '0' from the data source for row 0错误

    在做datatables的项目,从后台取得数据后,返回给datatables界面时会报下面的错误: DataTables warning : Requested unknown parameter ' ...

  8. c语言实验一

    #include <stdio.h> int main(){ int a,b,sum; a=123; b=456; sum = a + b; printf("sum is %d\ ...

  9. 《Miracle_House》团队项目系统设计改进

    一.团队项目系统设计改进: 1.分析项目系统设计说明书初稿的不足,特别是软件系统结构模型建模不完善内容: 对于原文档中,设计图中存在的错误以及文字描述不准确的地方进行了修改. 2. 团队项目Githu ...

  10. Mac 安装配置Jenkins+github完成项目构建

    Jenkins Jenkins是一款开源 CI&CD 软件,用于自动化各种任务,包括构建.测试和部署软件.Jenkins 支持各种运行方式,可通过系统包, Docker 或者通过一个独立的 J ...