失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > 刷新后 页面 保持滚动条位置

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

时间:2023-03-06 21:04:03

相关推荐

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

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

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();">

如果觉得《刷新后 页面 保持滚动条位置》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。