在updatepanels而不是页面中保持列表框中的滚动位置

我在更新面板中有一个列表框。 当我向下滚动并选择一个项目时，它会滚动回列表框的顶部。 我听说dom没有跟踪回发上的滚动位置。 有没有人有解决方案/示例如何解决这个问题？

谢谢，XaiSoft

Answer 1

您遇到了这个问题，因为当异步请求返回时， UpdatePanel完全用新的元素替换滚动的元素。

可能的解决方案：

1. 在提交UpdatePanel之前（通过调用ClientScriptManager.RegisterOnSubmitStatement方法）使用JavaScript将元素的scrollTop属性存储在隐藏的表单元素中，然后在AJAX调用返回时在新的上设置它。 这将是乏味的，容易出错，并且可能不太兼容（见这里 ）。

2. 使用JavaScript存储的selectedIndex属性，并在AJAX调用返回时重新选择该项。 显然，如果用户尚未选择任何内容，这将不起作用。

3. 不要使用UpdatePanel 。 请尝试使用jQuery + ASP.NET页面方法 。

Answer 2

  var xPos, yPos; var prm = Sys.WebForms.PageRequestManager.getInstance(); function BeginRequestHandler(sender, args) { if (($get('Panel1')) != null) { xPos = $get('Panel1').scrollLeft; yPos = $get('Panel1').scrollTop; } } function EndRequestHandler(sender, args) { if (($get('Panel1')) != null) { $get('Panel1').scrollLeft = xPos; $get('Panel1').scrollTop = yPos; } } prm.add_beginRequest(BeginRequestHandler); prm.add_endRequest(EndRequestHandler); //Note: "Panel1" Panel or div u want to maintain scroll position //Note: This Java Script should be added after Scriptmanager***** 

//使用“更新”面板保持Panel / Div的滚动位置

  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('Panel1').scrollTop = strPos; } } function SetDivPosition() { var intY = document.getElementById('Panel1').scrollTop; document.title = intY; document.cookie = "yPos=!~" + intY + "~!"; } //Note: "Panel1" Panel id or div id for which u want to maintain scroll position 

Answer 3

以下代码示例似乎以下列方式滚动：

• Internet Explorer 8：回发后，所选项目是第一个可见项目。

• Firefox：回发后，所选项目始终可见（但可能是最后一个可见项目）。

• Chrome：回发后，可能会隐藏所选项目，因为列表框会滚动到顶部，如您所说。

 
     <的ContentTemplate>
         
            的 A 
            的乙
            的 C 
            的 d 
            的电子
            的˚F
            的
            的ħ
         
     
 

Answer 4

您仍然可以使用包含ListBox的UpdatePanel来实现部分回发，但是通过在UpdatePanel上设置以下内容来阻止它被新实例覆盖：

 ChildrenAsTriggers="False" 

这在MSDN中说明 ：

获取或设置一个值，该值指示UpdatePanel控件的直接子控件的回发是否更新了面板的内容。 如果您不希望UpdatePanel控件的直接子控件的回发导致更新面板的内容，请将ChildrenAsTriggers属性设置为false。

对此的一个警告是，如果您尝试从服务器端对ListBox执行任何其他可视化操作（即将CSS属性添加到回发上的项目），那么在发生另一个不相关的回发之前，您将看不到它们呈现。 如果您所做的只是设置选择，而不是设置ChildrenAsTriggers="False"将起作用。

Answer 5

对于我正在处理的企业应用程序，事实certificateMasterPage.Master页面正在处理Sys.WebForms.PageRequestManager.getInstance（）。add_endRequest事件并在其中设置window.scroll（0,0）。 内容页面显然在内容页面的UpdatePanel的每个触发器上执行window.scroll（0,0）。 我尝试覆盖内容页面中的add_endRequestfunction，但无法使其工作。 最后我只修改了Master.Master，不做window.scroll（0,0）。