如何使页面刷新后仍然保持滚动条位置,有几种方法:
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实现保持滚动条位置效果
<scriptlanguage="javascript">
<!--
//获取当前文件名
functiongetFileName()
{
varurl=this.location.href;
varpos=url.lastIndexOf("/");
if(pos==-1)
pos=url.lastIndexOf("\\");
varfilename=url.substr(pos+1);
returnfilename;
}
functionfnLoad()
{
with(window.document.body)
{
addBehavior("#default#userData");//使 得body元素可以支持userdate
load("scrollState"+getFileName());//获 取以前保存在userdate中的状态
if(sFirstEnter=="0")
{scrollLeft=getAttribute("scrollLeft");//滚 动条左位置
scrollTop=getAttribute("scrollTop");
}
}
}
functionfnUnload()
{
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保持页面滚动条位置
<SCRIPTLANGUAGE="JavaScript">
<!--
/*haiwa@-02-12*/
functionTrim(strValue)
{
returnstrValue.replace(/^\s*|\s*$/g,"");
}
functionSetCookie(sName,sValue)
{
document.cookie=sName+"="+escape(sValue);
}
functionGetCookie(sName)
{
varaCookie=document.cookie.split(";");
for(vari=0;i<aCookie.length;i++)
{
varaCrumb=aCookie[i].split("=");
if(sName==Trim(aCrumb[0]))
{
returnunescape(aCrumb[1]);
}
}
returnnull;
}
functionscrollback()
{
if(GetCookie("scroll")!=null){document.body.scrollTop=GetCookie("scroll")}
}
//-->
</script>
然后修改BODY位置为
<BODYid=bodyonscroll=SetCookie("scroll",body.scrollTop);onload="scrollback();">
如果觉得《刷新后 页面 保持滚动条位置》对你有帮助,请点赞、收藏,并留下你的观点哦!