保持在回发一个页面内一个div滚动位置 [英] Maintain scroll position of a div within a page on postback

查看:182
本文介绍了保持在回发一个页面内一个div滚动位置的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有溢出设置为自动一个aspx页面内的div。在div的内容是动态创建的,由链接按钮的列表。

I have a div within an aspx page with overflow set to auto. The contents of the div are dynamically created and consists of a list of link buttons.

<div id="div1" style="overflow: auto; height: 100%;">
.....
</div>

当我在DIV scoll下来,点击任何链接按钮后,页面重载失去了DIV中的滚动位置并带我到div的顶部。有没有什么办法prevent是什么?

When I scoll down in the div and click on any of the link buttons, the page reload loses the scroll position inside the div and takes me to the top of the div. Is there any way to prevent that?

请注意,这是在页面内的div。 Page.MaintainScrollPositionOnPostBack()不起作用。

Note that this is for a div inside the page. Page.MaintainScrollPositionOnPostBack() does not work.

推荐答案

杰夫小号提到来处理这种情况是使用JavaScript来跟踪每次加载页面的滚动位置重置到div的滚动位置和单向的previous值。

As Jeff S mentioned one way to handle this situation is using javascript to track the scroll position of the div and each time the page loads reset the scroll position to its previous value.

下面是一些示例code:

Here's some sample code:

<html>
<body onload="javascript:document.getElementById('div1').scrollTop = document.getElementById('scroll').value;">
    <form id="form1" runat="server">
    <input type="hidden" id="scroll" runat="server" />
    <div id="div1" style="overflow: auto; height: 100px;" onscroll="javascript:document.getElementById('scroll').value = this.scrollTop">
        ...........<br />
        ...........<br />
        ...........<br />
        ...........<br />
        ...........<br />
        ...........<br />
        ...........<br />
        ...........<br />
        ...........<br />
        ...........<br />
        ...........<br />
        ...........<br />
        <asp:LinkButton ID="LinkButton1" runat="server" Text="test2"></asp:LinkButton>
    </div>
    <asp:LinkButton ID="LinkButton2" runat="server" Text="test1"></asp:LinkButton>
    </form>
</body>
</html>

在实践中,我不会直接就把JavaScript中的元素,但它只是一个例子。您也可以存储在cookie而不是滚动位置。

In practice I wouldn't put the javascript directly in the elements but its just an example. You could also store the scroll position in a cookie instead.

这篇关于保持在回发一个页面内一个div滚动位置的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆