解决页面刷新后滚动条回滚的问题。

最新推荐文章于 2024-01-26 11:27:23 发布

原创最新推荐文章于 2024-01-26 11:27:23 发布 · 1.6k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#div #object #string #server

asp.net 专栏收录该内容

57 篇文章

订阅专栏

本文介绍了一种在ASP.NET网页中保存和恢复滚动位置的方法。通过创建隐藏字段来记录div或Panel元素的水平和垂直滚动位置，并在页面加载时重新设置这些位置，从而实现了在页面回发后滚动位置的保持。

1.在页面中新增一个方法
private void KeepScrollPosition(Control p)
        {
            HiddenField oScrollPosX = new HiddenField();
            HiddenField oScrollPosY = new HiddenField();
            oScrollPosX.ID = p.ClientID + "X";
            oScrollPosY.ID = p.ClientID + "Y";
            this.Form.Controls.Add(oScrollPosX);
            this.Form.Controls.Add(oScrollPosY);

            string sScript = "window.document.getElementById('" + oScrollPosX.ClientID + "').value =" +
                 "window.document.getElementById('" + p.ClientID + "').scrollLeft;";
            sScript = sScript + "window.document.getElementById('" + oScrollPosY.ClientID + "').value = " +
                 "window.document.getElementById('" + p.ClientID + "').scrollTop;";
            this.ClientScript.RegisterOnSubmitStatement(this.GetType(), "", sScript);

            if (IsPostBack)
            {
                oScrollPosX.Value = this.Request.Form[oScrollPosX.ClientID];
                oScrollPosY.Value = this.Request.Form[oScrollPosY.ClientID];

sScript = "window.document.getElementById('" + p.ClientID + "').scrollLeft = " + oScrollPosX.Value + ";" +
"window.document.getElementById('" + p.ClientID + "').scrollTop = " + oScrollPosY.Value + ";";

                this.ClientScript.RegisterStartupScript(this.GetType(), "", sScript, true);
            }
        }

2.在页面中设置需要设置滚动条的控件放在一个div或Panel中。
示例如下：
<div runat="server" id="sp" style="width: 100%; height: 450px; overflow:auto">
//这里是DataGrid...
</div>

3.在页面中调用基类中的KeepScrollPosition方法
protected override void Page_Load(object sender, EventArgs e)
{
            base.Page_Load(sender, e);
    //调用
            KeepScrollPosition(this.sp);
    //其他代码...

}