Question

我在web.config中使用了以下代码，以便在服务器回发后维护滚动条位置：

<pages maintainScrollPositionOnPostBack="true" >
</pages>

一切正常，但是现在我有一个gridview封装在一个div中，div中有一个滚动条（内部滚动条）。

当在gridview内的其中一行上发生事件时，内部滚动条不像外部滚动条那样保持其原始位置。

有什么想法吗？

Answer 1

供将来参考：

正常的过程是在web.config文件中编写以下内容：

  <system.web>
    <pages maintainScrollPositionOnPostBack="true" >
    </pages>
  </system.web>

这将保留所有网页的滚动条位置。

如果在gridview（或div）中有滚动条，请使用以下脚本：

<script type="text/javascript">
    window.onload = function () {
        var strCook = document.cookie;
        if (strCook.indexOf("!~") != 0) {
            var intS = strCook.indexOf("!~");
            var intE = strCook.indexOf("~!");
            var strPos = strCook.substring(intS + 2, intE);
            document.getElementById("grdWithScroll").scrollTop = strPos;
        }
    }
    function SetDivPosition() {
        var intY = document.getElementById("grdWithScroll").scrollTop;
        document.cookie = "yPos=!~" + intY + "~!";
    }
</script>

div必须如下：

<div id="grdWithScroll" …………  onscroll="SetDivPosition()">

http://michaelsync.net/2006/06/30/maintain-scroll-position-of-div-using-javascript-aspnet-20

Answer 2

试试这个，

 <script type="text/javascript">
  window.onload = function () {
               var h = document.getElementById("<%=hfScrollPosition.ClientID%>");
               document.getElementById("<%=scrollArea.ClientID%>").scrollTop = h.value;
              }
   function SetDivPosition() {
           var intY = document.getElementById("<%=scrollArea.ClientID%>").scrollTop;
           var h = document.getElementById("<%=hfScrollPosition.ClientID%>");
           h.value = intY;
     }

  function afterpostback() {

            var h = document.getElementById("<%=hfScrollPosition.ClientID%>");
            document.getElementById("<%=scrollArea.ClientID%>").scrollTop = h.value;

     }

</script> 

 <asp:HiddenField ID="hfScrollPosition" runat="server" Value="0" />
 <div id="scrollArea" onscroll="SetDivPosition()"   runat="server"  style="height:225px;overflow:auto;overflow-x:hidden;">

在Page_Load

中

if (Page.IsPostBack) {
    ScriptManager.RegisterClientScriptBlock(Page, this.GetType(), "CallJS", "afterpostback();", true);
    }

Answer 3

你可以做你想做的事情，但需要在客户端使用像jQuery这样的东西。以下教程使用jQuery确定GridView控件中滚动条的值，然后在每次调用$(document).ready函数时恢复该值。通过这种方式，您的滚动条将在回发之前重置为它的位置。

Easily maintaining scroll position in GridView using jQuery

Answer 4

我没有很长的解释和解释，最重要的部分是这些代码适用于我的项目。

<script  type="text/javascript">
// This Script is used to maintain Grid Scroll on Partial Postback
var scrollTop;
//Register Begin Request and End Request 
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
//Get The Div Scroll Position

function BeginRequestHandler(sender, args) 
{
var m = document.getElementById('divGrid');
scrollTop=m.scrollTop;
}
//Set The Div Scroll Position
function EndRequestHandler(sender, args)
{
var m = document.getElementById('divGrid');
m.scrollTop = scrollTop;
} 
</script>

来自http://www.codeproject.com/Articles/30235/Maintain-GridView-Scroll-Position-and-Header-Insid

在PostBack之后维护网格视图中div的滚动条位置

4 个答案: