C# 在回发后保持网格视图中 div 的滚动条位置
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12092150/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Maintain Scroll Bar position of a div within a gridview after a PostBack
提问by cgval
I used the following piece of code in the web.config in order to maintain the scrollbar position after a server postback:
我在 web.config 中使用了以下代码段，以便在服务器回发后保持滚动条位置：
<pages maintainScrollPositionOnPostBack="true" >
</pages>
All is working fine, but now i have a gridview encapsuled within a div with a scrollbar in the div (internal scrollbar).
一切正常，但现在我有一个 gridview 封装在 div 中，div 中有一个滚动条（内部滚动条）。
When an event occur on one of the rows inside the gridview, the internal scrollbar doesn't maintain its original position unlike the outer one.
当 gridview 内的某一行发生事件时，与外部滚动条不同，内部滚动条不会保持其原始位置。
Any ideas?
有任何想法吗？
采纳答案by cgval
For future reference:
备查：
The normal procedure is to write the following in the web.config file:
正常的程序是在 web.config 文件中写入以下内容：
<system.web>
<pages maintainScrollPositionOnPostBack="true" >
</pages>
</system.web>
This will preserve the scroll bar position of all web pages.
这将保留所有网页的滚动条位置。
If you have a scroll bar within a gridview (or div) then use the following script:
如果您在 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>
And the div must be as follows:
并且 div 必须如下：
<div id="grdWithScroll" ………… onscroll="SetDivPosition()">
http://michaelsync.net/2006/06/30/maintain-scroll-position-of-div-using-javascript-aspnet-20
http://michaelsync.net/2006/06/30/maintain-scroll-position-of-div-using-javascript-aspnet-20
回答by atconway
You can do what you want, but it will need to be done client-side with something like jQuery. The following tutorial uses jQuery to determine the value of the scrollbar within your GridView control and then restore that value every time the $(document).readyfunction is called. In this manner your scroll bar will be reset to it's position before the postback as you wish.
你可以做你想做的事，但它需要在客户端使用 jQuery 之类的东西来完成。以下教程使用 jQuery 来确定 GridView 控件中滚动条的值，然后在每次$(document).ready调用该函数时恢复该值。通过这种方式，您的滚动条将根据您的需要重置到回发之前的位置。
回答by vml19
Try this,
尝试这个，
<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;">
In the Page_Load
在 Page_Load 中
if (Page.IsPostBack) {
ScriptManager.RegisterClientScriptBlock(Page, this.GetType(), "CallJS", "afterpostback();", true);
}
回答by dada
I dont have a long long explanation and any explanation, the most important part is these codes work on my project.
我没有很长很长的解释和任何解释，最重要的部分是这些代码适用于我的项目。
<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>
this is from http://www.codeproject.com/Articles/30235/Maintain-GridView-Scroll-Position-and-Header-Insid
这是来自http://www.codeproject.com/Articles/30235/Maintain-GridView-Scroll-Position-and-Header-Insid
