3

有人可以帮我完成这项工作吗?我想我需要为此使用 JS,但我对它的经验很少......所以我认为一些代码示例可能很有用。我得到了这样的简单表格(为简化起见,我没有复制表格的内容,因为它有很多代码并且不相关。

<div style="overflow:auto; height:600px; border:2px solid black; border-radius:5px; background:white">
<table style="width:100%; border-collapse:collapse">
<thead>
</thead>
<tbody>
</tbody>
</table>
</div>
4

2 回答 2

1

在 jQuery 中(这将保存一个带有滚动位置的 cookie):

// When document is ready...
$(document).ready(function() {

    // If cookie is set, scroll to the position saved in the cookie.
    if ( $.cookie("scroll") !== null ) {
        $(".yourTableContainerDIV").scrollTop( $.cookie("scroll") );
    }

    // On window unload, save cookie
    $(window).unload(function() {
        $.cookie("scroll", $(".yourTableContainerDIV").scrollTop() );
    });
});

取自这个答案,稍作修改。

编辑:

所以它并不完全奏效。

第一个问题是,如果您使用此表,您需要阅读的不是容器 DIV scrollTop,而是您需要查看的 tbody。

而第二个问题是调用$(".scrollContent").scrollTop()之前的值变成了0 。$(window).unload()当我像这样修改代码时:

// When document is ready...
$(document).ready(function() {

    // If cookie is set, scroll to the position saved in the cookie.
    if ( $.cookie("scroll") !== null ) {
        $(".yourTableContainerDIV").scrollTop( $.cookie("scroll") );
    }

    // Set i to the current scroll position every 100 milliseconds.
    var i;
    window.setInterval(function(){i=$(".scrollContent").scrollTop()}, 100);

    // On window unload, save cookie.
    $(window).unload(function() {
        $.cookie("scroll", i);
    });
});

效果很好!但是你有一个函数被调用,并且每十分之一秒设置一个值,这对性能来说不太好。另一种方法是window.beforeUnload像这样使用:

// When document is ready...
$(document).ready(function() {
    // If cookie is set, scroll to the position saved in the cookie.
    if ( $.cookie("scroll") !== null ) {
        $(".yourTableContainerDIV").scrollTop( $.cookie("scroll") );
    }
});

window.onbeforeunload = function(){
    $.cookie("scroll", $(".scrollContent").scrollTop());
    return;
}

这在大多数浏览器中效果很好并且不涉及间隔,但它在 Opera 中不起作用。

希望这可以帮助...

于 2012-10-26T02:08:16.067 回答
0

这是一个 100% 可行的解决方案,适用于任何需要它的人的持久表滚动位置。

    // save position of table scroll
    $(function () {
        // If cookie is set, scroll to the position saved in the cookie.
        if ($.cookie("scroll") !== null) {
            $('#bScroll').scrollTop($.cookie("scroll"));
        }
    });

    window.onbeforeunload = function () {
        $.cookie("scroll", $('#bScroll').scrollTop());
        return;
    }

设置 tbody id='bScroll' 就可以了。

简单而有保证。那里有很多“解决方案”,但除了这个之外,没有一个对我有用。

于 2021-06-11T18:46:10.490 回答