刷新后 页面 保持滚动条位置

如何使页面刷新后仍然保持滚动条位置，有几种方法：

1. MaintainScrollPositionOnPostBack  最好

在Page_Load 中加入 Page.MaintainScrollPositionOnPostBack  = True

或者在页面的<%@ Page  %>  中加入MaintainScrollPositionOnPostBack = True  一样的效果

2.SmartNavigation

在Page_Load 中加入 Page.SmartNavigation=  True

或者在页面的<%@ Page  %> 中加入SmartNavigation=  True 

这中方法已经过时了，有的时候会出现CSS的样式无法显示的情况

3.javasvript方法1

如果ascx（Custom Control）自定义空间太长，可以用jscript实现保持滚动条位置效果

<script language="javascript">
<!--
//  获取当前文件名
function getFileName()
 {
     var url = this.location.href;
     var pos = url.lastIndexOf("/");
     if(pos == -1)
         pos = url.lastIndexOf("\\");
     var filename = url.substr(pos+1);
     return filename;
 }
function fnLoad()
 {
     with(window.document.body)
     {
         addBehavior ("#default#userData");    // 使 得body元素可以支持userdate
        load("scrollState" + getFileName());    // 获 取以前保存在userdate中的状态
        if (sFirstEnter=="0")
         {   scrollLeft = getAttribute("scrollLeft");    // 滚 动条左位置
            scrollTop = getAttribute("scrollTop");
         }
     }
 }
function fnUnload()
 {
     with(window.document.body)
     {   setAttribute("scrollLeft",scrollLeft);
         setAttribute("scrollTop",scrollTop);
         save("scrollState" + getFileName());    
         // 防止受其他文件的userdate数据影响，所以将文件名加上了
        // userdate里的数据是不能跨 目录访问的
    }
 }
window.onload = fnLoad;
 window.onunload = fnUnload;
// -->
</script>

 

网上说只要具有scroll属性的html控件，都可以用这个方法来实现页面刷新后的滚动条的定位。当然，函数是要做一下改动。把  with（window.document.body）中的body改为其他控件的ID就可以了：  with（window.document.all["控件ID"]）

4.javascript 方法2

这是在网上看到的另一种用JS保持页面滚动条位置

<SCRIPT LANGUAGE="JavaScript">
<!--   
   /*haiwa@2004-02-12*/   
   function Trim(strValue)   
   {   
   return strValue.replace(/^\s*|\s*$/g,"");   
   }   
   function SetCookie(sName, sValue)   
   {   
   document.cookie = sName + "=" + escape(sValue);   
   }   
   function GetCookie(sName)   
   {   
   var aCookie = document.cookie.split(";");   
   for (var i=0; i < aCookie.length; i++)   
   {   
   var aCrumb = aCookie[i].split("=");   
   if (sName == Trim(aCrumb[0]))   
   {   
   return unescape(aCrumb[1]);   
   }   
   }   
   return null;   
   }   
   function scrollback()   
   {   
   if (GetCookie("scroll")!=null){document.body.scrollTop=GetCookie("scroll")}   
   }   
   //-->
</script>

 然后修改BODY位置为

<BODY id=body onscroll=SetCookie("scroll",body.scrollTop); onload="scrollback();">

 

posted @ 2013-11-06 14:46  xxdotnet  阅读(380)  评论(0)  编辑  收藏  举报