我有一个div:
<div style="overflow-y: scroll; height: 260px">
我包含几百条记录,并允许我选择一个项目来填充它下面的formview控件。
问题是当页面回发时,滚动条位置会回到div的顶部。我想尝试保持其位置,以便所选记录仍然可见。
有什么想法吗?
答案 0 :(得分:9)
放置类似的东西:
<asp:HiddenField id="hdnScrollPos" runat="server"/> in your aspx.
然后,一些javascript如:
var hdnScroll = document.getElementById(<%=hdnScrollPos.ClientID%>);
var bigDiv = document.getElementById('bigDiv');
bigDiv.onscroll = function() {
hdnScroll.value = bigDiv.scrollTop;
}
window.onload = function () {
bigDiv.scrollTop = hdnScroll.value;
}
答案 1 :(得分:3)
以下是使用JQuery的FlySwat解决方案的更精确方法,它对我有用:
var $ScrollPosition = $('#hfScrollPosition');
var $ScrollingDiv = $('#pnlGroupDataContent');
if ($ScrollPosition.length && $ScrollingDiv.length) {
// Store scrolling value
$ScrollingDiv.scroll(function () {
$ScrollPosition.val($ScrollingDiv.scrollTop());
});
// Set scrolling
$ScrollingDiv.scrollTop($ScrollPosition.val());
}
答案 2 :(得分:1)
免责声明 - 不是我的代码,但我之前看过这个:
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("divTest").scrollTop = strPos;
document.getElementById("divTest").scrollTop = strPos;
}
}
function SetDivPosition(){
var intY = document.getElementById("divTest").scrollTop;
document.cookie = "yPos=!~" + intY + "~!";
}
我们的想法是将滚动条的位置存储在cookie中。另一个(更好的?)选项是将其存储在隐藏字段(或字段)中。希望能让你前进......
答案 3 :(得分:1)
ASP.NET内置了这个你需要做的就是在你的页面指令中包含MaintainScrollPositionOnPostback。
<%@ Page Language="C#" MaintainScrollPositionOnPostback="true" %>
答案 4 :(得分:1)
将thebody
替换为document.getElementById("divTest")
如果您担心onscroll事件在opera / ff中不起作用,您可以尝试更改
thebody.onscroll=SaveScrollLocation;
到
setInterval('SaveScrollLocation()", 500);
答案 5 :(得分:1)
尝试了上述所有内容,并且没有一个在chrome v39中令人满意地工作,但是这个页面上使用的方法非常有效: