在非ajax页面中,只要在page上设置MaintainScrollPositionOnPostback="true"即可进行记忆滚动条位置. 但是在ajax中,这个功能却不能正确工作了,那么我们应当如何让div自动维护滚动条位置呢?下面学步园小编来讲解下如何让div自动维护滚动条位置?
如何让div自动维护滚动条位置
首先在页面上增加asp:panel控件,然后在aspx.cs后台加入以下方法:
[c#]
protectedvoidDoMaintainScrollPositionForAjax(UpdatePanelupdatePanel,Panelpanel)
{
StringBuildersb=newStringBuilder();
sb.AppendLine(@"functionPanel_SaveScrollPosition(PanelID){
if(document.getElementById(PanelID)!=null){
document.getElementById(PanelID+'_ScrollPosX').value=document.getElementById(PanelID).scrollLeft;
document.getElementById(PanelID+'_ScrollPosY').value=document.getElementById(PanelID).scrollTop;}}
functionPanel_RestoreScrollPosition(PanelID){
if(document.getElementById(PanelID)!=null){
document.getElementById(PanelID).scrollLeft=document.getElementById(PanelID+'_ScrollPosX').value;
document.getElementById(PanelID).scrollTop=document.getElementById(PanelID+'_ScrollPosY').value;}}");
如何让div自动维护滚动条位置
ScriptManager.RegisterClientScriptBlock(updatePanel,panel.GetType(),"PanelScrollFunction",sb.ToString(),true);
HiddenFieldx=newHiddenField();
x.ID=panel.ClientID+"_ScrollPosX";
x.ClientIDMode=panel.ClientIDMode;
panel.Controls.Add(x);
HiddenFieldy=newHiddenField();
y.ID=panel.ClientID+"_ScrollPosY";
y.ClientIDMode=panel.ClientIDMode;
panel.Controls.Add(y);
stringsScript="Panel_SaveScrollPosition('"+panel.ClientID+"');";
ScriptManager.RegisterOnSubmitStatement(updatePanel,panel.GetType(),panel.ID+"_SavePanelScroll",sScript);
if(Page.IsPostBack)
{
x.Value=Page.Request.Form[x.ClientID];
y.Value=Page.Request.Form[y.ClientID];
sScript="Panel_RestoreScrollPosition('"+panel.ClientID+"');";
ScriptManager.RegisterStartupScript(updatePanel,panel.GetType(),panel.ID+"_SetPanelScroll",sScript,true);
}
}
protectedvoidDoMaintainScrollPositionForAjax(UpdatePanelupdatePanel,Panelpanel)
{
StringBuildersb=newStringBuilder();
sb.AppendLine(@"functionPanel_SaveScrollPosition(PanelID){
if(document.getElementById(PanelID)!=null){
document.getElementById(PanelID+'_ScrollPosX').value=document.getElementById(PanelID).scrollLeft;
document.getElementById(PanelID+'_ScrollPosY').value=document.getElementById(PanelID).scrollTop;}}
functionPanel_RestoreScrollPosition(PanelID){
if(document.getElementById(PanelID)!=null){
document.getElementById(PanelID).scrollLeft=document.getElementById(PanelID+'_ScrollPosX').value;
document.getElementById(PanelID).scrollTop=document.getElementById(PanelID+'_ScrollPosY').value;}}");
ScriptManager.RegisterClientScriptBlock(updatePanel,panel.GetType(),"PanelScrollFunction",sb.ToString(),true);
HiddenFieldx=newHiddenField();
x.ID=panel.ClientID+"_ScrollPosX";
x.ClientIDMode=panel.ClientIDMode;
panel.Controls.Add(x);
HiddenFieldy=newHiddenField();
y.ID=panel.ClientID+"_ScrollPosY";
y.ClientIDMode=panel.ClientIDMode;
panel.Controls.Add(y);
stringsScript="Panel_SaveScrollPosition('"+panel.ClientID+"');";
ScriptManager.RegisterOnSubmitStatement(updatePanel,panel.GetType(),panel.ID+"_SavePanelScroll",sScript);
if(Page.IsPostBack)
{
x.Value=Page.Request.Form[x.ClientID];
y.Value=Page.Request.Form[y.ClientID];
sScript="Panel_RestoreScrollPosition('"+panel.ClientID+"');";
ScriptManager.RegisterStartupScript(updatePanel,panel.GetType(),panel.ID+"_SetPanelScroll",sScript,true);
}
}
通过以下方法在aspx.cs调用即可
[c#]
protectedvoidPage_Load(objectsender,EventArgse)
{
DoMaintainScrollPositionForAjax(this.UpdatePanel1,Panel1);
}
protectedvoidPage_Load(objectsender,EventArgse)
{
DoMaintainScrollPositionForAjax(this.UpdatePanel1,Panel1);
}
以上就是关于“如何让div自动维护滚动条位置”的内容，希望对大家有用。更多资讯请关注学步园。学步园，您学习IT技术的优质平台!